utopia-ui 3.0.63 → 3.0.65
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 +997 -583
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +42 -67
- package/dist/index.esm.js +680 -282
- package/dist/index.esm.js.map +1 -1
- package/dist/types/src/Components/AppShell/AppShell.d.ts +1 -1
- package/dist/types/src/Components/AppShell/Content.d.ts +2 -2
- package/dist/types/src/Components/AppShell/ContextWrapper.d.ts +2 -2
- package/dist/types/src/Components/AppShell/NavBar.d.ts +1 -2
- package/dist/types/src/Components/AppShell/SetAppState.d.ts +1 -2
- package/dist/types/src/Components/AppShell/SideBar.d.ts +5 -6
- package/dist/types/src/Components/AppShell/SidebarSubmenu.d.ts +2 -1
- package/dist/types/src/Components/Auth/RequestPasswordPage.d.ts +1 -1
- package/dist/types/src/Components/Auth/index.d.ts +1 -1
- package/dist/types/src/Components/Auth/useAuth.d.ts +5 -5
- package/dist/types/src/Components/Gaming/hooks/useQuests.d.ts +3 -2
- package/dist/types/src/Components/Input/SelectBox.d.ts +2 -2
- package/dist/types/src/Components/Input/TextAreaInput.d.ts +2 -2
- package/dist/types/src/Components/Input/TextInput.d.ts +2 -2
- package/dist/types/src/Components/Map/Layer.d.ts +2 -1
- package/dist/types/src/Components/Map/hooks/useDebounce.d.ts +1 -1
- package/dist/types/src/Components/Map/hooks/usePermissions.d.ts +1 -1
- package/dist/types/src/Components/Profile/index.d.ts +0 -1
- package/package.json +5 -5
package/dist/index.cjs
CHANGED
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var leaflet = require('leaflet');
|
|
5
5
|
var reactLeaflet = require('react-leaflet');
|
|
6
6
|
var reactQuery = require('@tanstack/react-query');
|
|
7
|
-
var
|
|
7
|
+
var React = require('react');
|
|
8
8
|
var reactRouterDom = require('react-router-dom');
|
|
9
9
|
var reactToastify = require('react-toastify');
|
|
10
10
|
require('leaflet/dist/leaflet.css');
|
|
@@ -27,6 +27,25 @@ var reactImageCrop = require('react-image-crop');
|
|
|
27
27
|
require('react-image-crop/dist/ReactCrop.css');
|
|
28
28
|
var reactColorful = require('react-colorful');
|
|
29
29
|
|
|
30
|
+
function _interopNamespaceDefault(e) {
|
|
31
|
+
var n = Object.create(null);
|
|
32
|
+
if (e) {
|
|
33
|
+
Object.keys(e).forEach(function (k) {
|
|
34
|
+
if (k !== 'default') {
|
|
35
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
36
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
37
|
+
enumerable: true,
|
|
38
|
+
get: function () { return e[k]; }
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
n.default = e;
|
|
44
|
+
return Object.freeze(n);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
48
|
+
|
|
30
49
|
function styleInject(css, ref) {
|
|
31
50
|
if ( ref === void 0 ) ref = {};
|
|
32
51
|
var insertAt = ref.insertAt;
|
|
@@ -54,54 +73,55 @@ function styleInject(css, ref) {
|
|
|
54
73
|
}
|
|
55
74
|
}
|
|
56
75
|
|
|
57
|
-
var css_248z$4 = "*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}/*\n! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: Helvetica, sans-serif, Roboto; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden]:where(:not([hidden=\"until-found\"])) {\n display: none;\n}\n\n:root,\n[data-theme] {\n background-color: var(--fallback-b1,oklch(var(--b1)/1));\n color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n\n@supports not (color: oklch(0% 0 0)) {\n\n :root {\n color-scheme: light;\n --fallback-p: #491eff;\n --fallback-pc: #d4dbff;\n --fallback-s: #ff41c7;\n --fallback-sc: #fff9fc;\n --fallback-a: #00cfbd;\n --fallback-ac: #00100d;\n --fallback-n: #2b3440;\n --fallback-nc: #d7dde4;\n --fallback-b1: #ffffff;\n --fallback-b2: #e5e6e6;\n --fallback-b3: #e5e6e6;\n --fallback-bc: #1f2937;\n --fallback-in: #00b3f0;\n --fallback-inc: #000000;\n --fallback-su: #00ca92;\n --fallback-suc: #000000;\n --fallback-wa: #ffc22d;\n --fallback-wac: #000000;\n --fallback-er: #ff6f70;\n --fallback-erc: #000000;\n }\n\n @media (prefers-color-scheme: dark) {\n\n :root {\n color-scheme: dark;\n --fallback-p: #7582ff;\n --fallback-pc: #050617;\n --fallback-s: #ff71cf;\n --fallback-sc: #190211;\n --fallback-a: #00c7b5;\n --fallback-ac: #000e0c;\n --fallback-n: #2a323c;\n --fallback-nc: #a6adbb;\n --fallback-b1: #1d232a;\n --fallback-b2: #191e24;\n --fallback-b3: #15191e;\n --fallback-bc: #a6adbb;\n --fallback-in: #00b3f0;\n --fallback-inc: #000000;\n --fallback-su: #00ca92;\n --fallback-suc: #000000;\n --fallback-wa: #ffc22d;\n --fallback-wac: #000000;\n --fallback-er: #ff6f70;\n --fallback-erc: #000000;\n }\n }\n}\n\nhtml {\n -webkit-tap-highlight-color: transparent;\n}\n\n* {\n scrollbar-color: color-mix(in oklch, currentColor 35%, transparent) transparent;\n}\n\n*:hover {\n scrollbar-color: color-mix(in oklch, currentColor 60%, transparent) transparent;\n}\n\n:root {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 89.824% 0.06192 275.75;\n --ac: 15.352% 0.0368 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 49.12% 0.3096 275.75;\n --s: 69.71% 0.329 342.55;\n --sc: 98.71% 0.0106 342.55;\n --a: 76.76% 0.184 183.61;\n --n: 32.1785% 0.02476 255.701624;\n --nc: 89.4994% 0.011585 252.096176;\n --b1: 100% 0 0;\n --b2: 96.1151% 0 0;\n --b3: 92.4169% 0.00108 197.137559;\n --bc: 27.8078% 0.029596 256.847952;\n}\n\n@media (prefers-color-scheme: dark) {\n\n :root {\n color-scheme: dark;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 13.138% 0.0392 275.75;\n --sc: 14.96% 0.052 342.55;\n --ac: 14.902% 0.0334 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 65.69% 0.196 275.75;\n --s: 74.8% 0.26 342.55;\n --a: 74.51% 0.167 183.61;\n --n: 31.3815% 0.021108 254.139175;\n --nc: 74.6477% 0.0216 264.435964;\n --b1: 25.3267% 0.015896 252.417568;\n --b2: 23.2607% 0.013807 253.100675;\n --b3: 21.1484% 0.01165 254.087939;\n --bc: 74.6477% 0.0216 264.435964;\n }\n}\n\n[data-theme=light] {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 89.824% 0.06192 275.75;\n --ac: 15.352% 0.0368 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 49.12% 0.3096 275.75;\n --s: 69.71% 0.329 342.55;\n --sc: 98.71% 0.0106 342.55;\n --a: 76.76% 0.184 183.61;\n --n: 32.1785% 0.02476 255.701624;\n --nc: 89.4994% 0.011585 252.096176;\n --b1: 100% 0 0;\n --b2: 96.1151% 0 0;\n --b3: 92.4169% 0.00108 197.137559;\n --bc: 27.8078% 0.029596 256.847952;\n}\n\n[data-theme=dark] {\n color-scheme: dark;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 13.138% 0.0392 275.75;\n --sc: 14.96% 0.052 342.55;\n --ac: 14.902% 0.0334 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 65.69% 0.196 275.75;\n --s: 74.8% 0.26 342.55;\n --a: 74.51% 0.167 183.61;\n --n: 31.3815% 0.021108 254.139175;\n --nc: 74.6477% 0.0216 264.435964;\n --b1: 25.3267% 0.015896 252.417568;\n --b2: 23.2607% 0.013807 253.100675;\n --b3: 21.1484% 0.01165 254.087939;\n --bc: 74.6477% 0.0216 264.435964;\n}\n\n[data-theme=cupcake] {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 15.2344% 0.017892 200.026556;\n --sc: 15.787% 0.020249 356.29965;\n --ac: 15.8762% 0.029206 78.618794;\n --nc: 84.7148% 0.013247 313.189598;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --p: 76.172% 0.089459 200.026556;\n --s: 78.9351% 0.101246 356.29965;\n --a: 79.3811% 0.146032 78.618794;\n --n: 23.5742% 0.066235 313.189598;\n --b1: 97.7882% 0.00418 56.375637;\n --b2: 93.9822% 0.007638 61.449292;\n --b3: 91.5861% 0.006811 53.440502;\n --bc: 23.5742% 0.066235 313.189598;\n --rounded-btn: 1.9rem;\n --tab-border: 2px;\n --tab-radius: 0.7rem;\n}\n\n[data-theme=retro] {\n color-scheme: light;\n --inc: 90.923% 0.043042 262.880917;\n --suc: 12.541% 0.033982 149.213788;\n --wac: 13.3168% 0.031484 58.31834;\n --erc: 13.144% 0.0398 27.33;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --p: 76.8664% 0.104092 22.664655;\n --pc: 26.5104% 0.006243 0.522862;\n --s: 80.7415% 0.052534 159.094608;\n --sc: 26.5104% 0.006243 0.522862;\n --a: 70.3919% 0.125455 52.953428;\n --ac: 26.5104% 0.006243 0.522862;\n --n: 28.4181% 0.009519 355.534017;\n --nc: 92.5604% 0.025113 89.217311;\n --b1: 91.6374% 0.034554 90.51575;\n --b2: 88.2722% 0.049418 91.774344;\n --b3: 84.133% 0.065952 90.856665;\n --bc: 26.5104% 0.006243 0.522862;\n --in: 54.615% 0.215208 262.880917;\n --su: 62.7052% 0.169912 149.213788;\n --wa: 66.584% 0.157422 58.31834;\n --er: 65.72% 0.199 27.33;\n --rounded-box: 0.4rem;\n --rounded-btn: 0.4rem;\n --rounded-badge: 0.4rem;\n --tab-radius: 0.4rem;\n}\n\n[data-theme=cyberpunk] {\n color-scheme: light;\n --b2: 87.8943% 0.16647 104.32;\n --b3: 81.2786% 0.15394 104.32;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --bc: 18.902% 0.0358 104.32;\n --pc: 14.844% 0.0418 6.35;\n --sc: 16.666% 0.0368 204.72;\n --ac: 14.372% 0.04352 310.43;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;\n --p: 74.22% 0.209 6.35;\n --s: 83.33% 0.184 204.72;\n --a: 71.86% 0.2176 310.43;\n --n: 23.04% 0.065 269.31;\n --nc: 94.51% 0.179 104.32;\n --b1: 94.51% 0.179 104.32;\n --rounded-box: 0;\n --rounded-btn: 0;\n --rounded-badge: 0;\n --tab-radius: 0;\n}\n\n[data-theme=aqua] {\n color-scheme: dark;\n --b2: 45.3464% 0.118611 261.181672;\n --b3: 41.9333% 0.109683 261.181672;\n --bc: 89.7519% 0.025508 261.181672;\n --sc: 12.1365% 0.02175 309.782946;\n --ac: 18.6854% 0.020445 94.555431;\n --nc: 12.2124% 0.023402 243.760661;\n --inc: 90.923% 0.043042 262.880917;\n --suc: 12.541% 0.033982 149.213788;\n --wac: 13.3168% 0.031484 58.31834;\n --erc: 14.79% 0.038 27.33;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 85.6617% 0.14498 198.6458;\n --pc: 40.1249% 0.068266 197.603872;\n --s: 60.6827% 0.108752 309.782946;\n --a: 93.4269% 0.102225 94.555431;\n --n: 61.0622% 0.117009 243.760661;\n --b1: 48.7596% 0.127539 261.181672;\n --in: 54.615% 0.215208 262.880917;\n --su: 62.7052% 0.169912 149.213788;\n --wa: 66.584% 0.157422 58.31834;\n --er: 73.95% 0.19 27.33;\n}\n\n[data-theme=docutopia] {\n --p: 54.645% 0.29421 298.46034;\n --b2: 25.8897% 0.107132 328.136712;\n --b3: 23.941% 0.099069 328.136712;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 90.929% 0.058842 298.46034;\n --sc: 13.9726% 0.031813 159.602475;\n --ac: 91.4207% 0.047244 260.255903;\n --nc: 84.1911% 0.008064 74.211583;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --s: 69.8629% 0.159065 159.602475;\n --a: 57.1034% 0.236222 260.255903;\n --n: 20.9553% 0.040319 74.211583;\n --bc: 81.3966% 0.126754 58.524936;\n --b1: 27.8384% 0.115196 328.136712;\n}\n\ninput[type=\"range\"]::-webkit-slider-thumb {\n height: 1rem;\n width: 1rem;\n border-radius: 9999px;\n border: 0;\n appearance: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n cursor: pointer;\n}\n\n.dark input[type=\"range\"]::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled:focus::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled:active::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled:focus::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled:active::-webkit-slider-thumb {}\n\ninput[type=\"range\"]::-moz-range-thumb {\n height: 1rem;\n width: 1rem;\n border-radius: 9999px;\n border: 0;\n appearance: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n cursor: pointer;\n}\n\n.dark input[type=\"range\"]::-moz-range-thumb {}\n\ninput[type=\"range\"]:disabled::-moz-range-thumb {}\n\n.dark input[type=\"range\"]:disabled::-moz-range-thumb {}\n\ninput[type=\"range\"]::-moz-range-progress {}\n\ninput[type=\"range\"]::-ms-fill-lower {}\n\n.dark input[type=\"range\"]::-moz-range-progress {}\n\n.dark input[type=\"range\"]::-ms-fill-lower {}\n\ninput[type=\"range\"]:focus {\n outline: none;\n}\n\ninput[type=\"range\"]:focus::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:active::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:focus::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:active::-webkit-slider-thumb {}\n.tw-alert {\n display: grid;\n width: 100%;\n grid-auto-flow: row;\n align-content: flex-start;\n align-items: center;\n justify-items: center;\n gap: 1rem;\n text-align: center;\n border-radius: var(--rounded-box, 1rem);\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n padding: 1rem;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --alert-bg: var(--fallback-b2,oklch(var(--b2)/1));\n --alert-bg-mix: var(--fallback-b1,oklch(var(--b1)/1));\n background-color: var(--alert-bg);\n}\n@media (min-width: 640px) {\n\n .tw-alert {\n grid-auto-flow: column;\n grid-template-columns: auto minmax(auto,1fr);\n justify-items: start;\n text-align: start;\n }\n}\n.tw-avatar {\n position: relative;\n display: inline-flex;\n}\n.tw-avatar > div {\n display: block;\n aspect-ratio: 1 / 1;\n overflow: hidden;\n}\n.tw-avatar img {\n height: 100%;\n width: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.tw-avatar.tw-placeholder > div {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.tw-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n height: 1.25rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n width: -moz-fit-content;\n width: fit-content;\n padding-left: 0.563rem;\n padding-right: 0.563rem;\n border-radius: var(--rounded-badge, 1.9rem);\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n}\n.tw-breadcrumbs {\n max-width: 100%;\n overflow-x: auto;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.tw-breadcrumbs > ul,\n .tw-breadcrumbs > ol {\n display: flex;\n align-items: center;\n white-space: nowrap;\n min-height: -moz-min-content;\n min-height: min-content;\n}\n.tw-breadcrumbs > ul > li, .tw-breadcrumbs > ol > li {\n display: flex;\n align-items: center;\n}\n.tw-breadcrumbs > ul > li > a, .tw-breadcrumbs > ol > li > a {\n display: flex;\n cursor: pointer;\n align-items: center;\n}\n@media (hover:hover) {\n\n .tw-breadcrumbs > ul > li > a:hover, .tw-breadcrumbs > ol > li > a:hover {\n text-decoration-line: underline;\n }\n\n .tw-checkbox-success:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n }\n\n .tw-label a:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n }\n\n .tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn):active,\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn).tw-active,\n.tw-menu li > details > summary:active {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n }\n\n .tw-tab:hover {\n --tw-text-opacity: 1;\n }\n\n .tw-table tr.tw-hover:hover,\n .tw-table tr.tw-hover:nth-child(even):hover {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n }\n}\n.tw-btn {\n display: inline-flex;\n height: 3rem;\n min-height: 3rem;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n border-radius: var(--rounded-btn, 0.5rem);\n border-color: transparent;\n border-color: oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity));\n padding-left: 1rem;\n padding-right: 1rem;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1em;\n gap: 0.5rem;\n font-weight: 600;\n text-decoration-line: none;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n border-width: var(--border-btn, 1px);\n transition-property: color, background-color, border-color, opacity, box-shadow, transform;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: var(--fallback-bc,oklch(var(--bc)/1));\n background-color: oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity));\n --tw-bg-opacity: 1;\n --tw-border-opacity: 1;\n}\n.tw-btn-disabled,\n .tw-btn[disabled],\n .tw-btn:disabled {\n pointer-events: none;\n}\n.tw-btn-square {\n height: 3rem;\n width: 3rem;\n padding: 0px;\n}\n.tw-btn-circle {\n height: 3rem;\n width: 3rem;\n border-radius: 9999px;\n padding: 0px;\n}\n:where(.tw-btn:is(input[type=\"checkbox\"])),\n:where(.tw-btn:is(input[type=\"radio\"])) {\n width: auto;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\n.tw-btn:is(input[type=\"checkbox\"]):after,\n.tw-btn:is(input[type=\"radio\"]):after {\n --tw-content: attr(aria-label);\n content: var(--tw-content);\n}\n.tw-card {\n position: relative;\n display: flex;\n flex-direction: column;\n border-radius: var(--rounded-box, 1rem);\n}\n.tw-card:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-card-body {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n padding: var(--padding-card, 2rem);\n gap: 0.5rem;\n}\n.tw-card-body :where(p) {\n flex-grow: 1;\n}\n.tw-card-actions {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 0.5rem;\n}\n.tw-card figure {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.tw-card.tw-image-full {\n display: grid;\n}\n.tw-card.tw-image-full:before {\n position: relative;\n content: \"\";\n z-index: 10;\n border-radius: var(--rounded-box, 1rem);\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n opacity: 0.75;\n}\n.tw-card.tw-image-full:before,\n .tw-card.tw-image-full > * {\n grid-column-start: 1;\n grid-row-start: 1;\n}\n.tw-card.tw-image-full > figure img {\n height: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.tw-card.tw-image-full > .tw-card-body {\n position: relative;\n z-index: 20;\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n}\n.tw-checkbox {\n flex-shrink: 0;\n --chkbg: var(--fallback-bc,oklch(var(--bc)/1));\n --chkfg: var(--fallback-b1,oklch(var(--b1)/1));\n height: 1.5rem;\n width: 1.5rem;\n cursor: pointer;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0.2;\n}\n.tw-divider {\n display: flex;\n flex-direction: row;\n align-items: center;\n align-self: stretch;\n margin-top: 1rem;\n margin-bottom: 1rem;\n height: 1rem;\n white-space: nowrap;\n}\n.tw-divider:before,\n .tw-divider:after {\n height: 0.125rem;\n width: 100%;\n flex-grow: 1;\n --tw-content: '';\n content: var(--tw-content);\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n}\n.tw-dropdown {\n position: relative;\n display: inline-block;\n}\n.tw-dropdown > *:not(summary):focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-dropdown .tw-dropdown-content {\n position: absolute;\n}\n.tw-dropdown:is(:not(details)) .tw-dropdown-content {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n visibility: hidden;\n opacity: 0;\n transform-origin: top;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n}\n.tw-dropdown-end .tw-dropdown-content {\n inset-inline-end: 0px;\n}\n.tw-dropdown-left .tw-dropdown-content {\n bottom: auto;\n inset-inline-end: 100%;\n top: 0px;\n transform-origin: right;\n}\n.tw-dropdown-right .tw-dropdown-content {\n bottom: auto;\n inset-inline-start: 100%;\n top: 0px;\n transform-origin: left;\n}\n.tw-dropdown-bottom .tw-dropdown-content {\n bottom: auto;\n top: 100%;\n transform-origin: top;\n}\n.tw-dropdown-top .tw-dropdown-content {\n bottom: 100%;\n top: auto;\n transform-origin: bottom;\n}\n.tw-dropdown-end.tw-dropdown-right .tw-dropdown-content {\n bottom: 0px;\n top: auto;\n}\n.tw-dropdown-end.tw-dropdown-left .tw-dropdown-content {\n bottom: 0px;\n top: auto;\n}\n.tw-dropdown.tw-dropdown-open .tw-dropdown-content,\n.tw-dropdown:not(.tw-dropdown-hover):focus .tw-dropdown-content,\n.tw-dropdown:focus-within .tw-dropdown-content {\n visibility: visible;\n opacity: 1;\n}\n@media (hover: hover) {\n\n .tw-dropdown.tw-dropdown-hover:hover .tw-dropdown-content {\n visibility: visible;\n opacity: 1;\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn.tw-glass:hover {\n --glass-opacity: 25%;\n --glass-border-opacity: 15%;\n }\n\n .tw-btn-ghost:hover {\n border-color: transparent;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n .tw-btn-ghost:hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n }\n }\n\n .tw-btn-ghost:hover {\n border-color: transparent;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n .tw-btn-ghost:hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n }\n }\n\n .tw-btn-outline.tw-btn-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary:hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary:hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-error:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-error:hover {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-error:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-error:hover {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n }\n\n .tw-btn-disabled:hover,\n .tw-btn[disabled]:hover,\n .tw-btn:disabled:hover {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:is(input[type=\"checkbox\"]:checked):hover, .tw-btn:is(input[type=\"radio\"]:checked):hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-dropdown.tw-dropdown-hover:hover .tw-dropdown-content {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n .tw-tab[disabled],\n .tw-tab[disabled]:hover {\n cursor: not-allowed;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n }\n}\n.tw-dropdown:is(details) summary::-webkit-details-marker {\n display: none;\n}\n.tw-file-input {\n height: 3rem;\n flex-shrink: 1;\n padding-inline-end: 1rem;\n font-size: 1rem;\n line-height: 2;\n line-height: 1.5rem;\n overflow: hidden;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-file-input::file-selector-button {\n margin-inline-end: 1rem;\n display: inline-flex;\n height: 100%;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n padding-left: 1rem;\n padding-right: 1rem;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 1em;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n border-style: solid;\n --tw-border-opacity: 1;\n border-color: var(--fallback-n,oklch(var(--n)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n font-weight: 600;\n text-transform: uppercase;\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n text-decoration-line: none;\n border-width: var(--border-btn, 1px);\n animation: button-pop var(--animation-btn, 0.25s) ease-out;\n}\n.tw-form-control {\n display: flex;\n flex-direction: column;\n}\n.tw-label {\n display: flex;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n align-items: center;\n justify-content: space-between;\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.tw-indicator {\n position: relative;\n display: inline-flex;\n width: -moz-max-content;\n width: max-content;\n}\n.tw-indicator :where(.tw-indicator-item) {\n z-index: 1;\n position: absolute;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n white-space: nowrap;\n}\n.tw-input {\n flex-shrink: 1;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n height: 3rem;\n padding-left: 1rem;\n padding-right: 1rem;\n font-size: 1rem;\n line-height: 2;\n line-height: 1.5rem;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-input[type=\"number\"]::-webkit-inner-spin-button,\n.tw-input-md[type=\"number\"]::-webkit-inner-spin-button {\n margin-top: -1rem;\n margin-bottom: -1rem;\n margin-inline-end: -1rem;\n}\n.tw-input-sm[type=\"number\"]::-webkit-inner-spin-button {\n margin-top: 0px;\n margin-bottom: 0px;\n margin-inline-end: -0px;\n}\n.tw-join .tw-dropdown .tw-join-item:first-child:not(:last-child),\n .tw-join *:first-child:not(:last-child) .tw-dropdown .tw-join-item {\n border-start-end-radius: inherit;\n border-end-end-radius: inherit;\n}\n.tw-mask {\n -webkit-mask-size: contain;\n mask-size: contain;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-position: center;\n mask-position: center;\n}\n.tw-menu {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n font-size: 0.875rem;\n line-height: 1.25rem;\n padding: 0.5rem;\n}\n.tw-menu :where(li ul) {\n position: relative;\n white-space: nowrap;\n margin-inline-start: 1rem;\n padding-inline-start: 0.5rem;\n}\n.tw-menu :where(li:not(.tw-menu-title) > *:not(ul, details, .tw-menu-title, .tw-btn)), .tw-menu :where(li:not(.tw-menu-title) > details > summary:not(.tw-menu-title)) {\n display: grid;\n grid-auto-flow: column;\n align-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n grid-auto-columns: minmax(auto, max-content) auto max-content;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.tw-menu li.tw-disabled {\n cursor: not-allowed;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n color: var(--fallback-bc,oklch(var(--bc)/0.3));\n}\n.tw-menu :where(li > .tw-menu-dropdown:not(.tw-menu-dropdown-show)) {\n display: none;\n}\n:where(.tw-menu li) {\n position: relative;\n display: flex;\n flex-shrink: 0;\n flex-direction: column;\n flex-wrap: wrap;\n align-items: stretch;\n}\n:where(.tw-menu li) .tw-badge {\n justify-self: end;\n}\n.tw-modal {\n pointer-events: none;\n position: fixed;\n inset: 0px;\n margin: 0px;\n display: grid;\n height: 100%;\n max-height: none;\n width: 100%;\n max-width: none;\n justify-items: center;\n padding: 0px;\n opacity: 0;\n overscroll-behavior: contain;\n z-index: 999;\n background-color: transparent;\n color: inherit;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-property: transform, opacity, visibility;\n overflow-y: hidden;\n}\n:where(.tw-modal) {\n align-items: center;\n}\n.tw-modal-box {\n max-height: calc(100vh - 5em);\n grid-column-start: 1;\n grid-row-start: 1;\n width: 91.666667%;\n max-width: 32rem;\n --tw-scale-x: .9;\n --tw-scale-y: .9;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n padding: 1.5rem;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;\n overflow-y: auto;\n overscroll-behavior: contain;\n}\n.tw-modal-open,\n.tw-modal:target,\n.tw-modal-toggle:checked + .tw-modal,\n.tw-modal[open] {\n pointer-events: auto;\n visibility: visible;\n opacity: 1;\n}\n:root:has(:is(.tw-modal-open, .tw-modal:target, .tw-modal-toggle:checked + .tw-modal, .tw-modal[open])) {\n overflow: hidden;\n scrollbar-gutter: stable;\n}\n.tw-navbar {\n display: flex;\n align-items: center;\n padding: var(--navbar-padding, 0.5rem);\n min-height: 4rem;\n width: 100%;\n}\n:where(.tw-navbar > *:not(script, style)) {\n display: inline-flex;\n align-items: center;\n}\n.tw-select {\n display: inline-flex;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n height: 3rem;\n min-height: 3rem;\n padding-inline-start: 1rem;\n padding-inline-end: 2.5rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),\n linear-gradient(135deg, currentColor 50%, transparent 50%);\n background-position: calc(100% - 20px) calc(1px + 50%),\n calc(100% - 16.1px) calc(1px + 50%);\n background-size: 4px 4px,\n 4px 4px;\n background-repeat: no-repeat;\n}\n.tw-select[multiple] {\n height: auto;\n}\n.tw-tabs {\n display: grid;\n align-items: flex-end;\n}\n.tw-tabs-lifted:has(.tw-tab-content[class^=\"rounded-\"])\n .tw-tab:first-child:not(:is(.tw-tab-active, [aria-selected=\"true\"])), .tw-tabs-lifted:has(.tw-tab-content[class*=\" rounded-\"])\n .tw-tab:first-child:not(:is(.tw-tab-active, [aria-selected=\"true\"])) {\n border-bottom-color: transparent;\n}\n.tw-tab {\n position: relative;\n grid-row-start: 1;\n display: inline-flex;\n height: 2rem;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n --tab-padding: 1rem;\n --tw-text-opacity: 0.5;\n --tab-color: var(--fallback-bc,oklch(var(--bc)/1));\n --tab-bg: var(--fallback-b1,oklch(var(--b1)/1));\n --tab-border-color: var(--fallback-b3,oklch(var(--b3)/1));\n color: var(--tab-color);\n padding-inline-start: var(--tab-padding, 1rem);\n padding-inline-end: var(--tab-padding, 1rem);\n}\n.tw-tab:is(input[type=\"radio\"]) {\n width: auto;\n border-bottom-right-radius: 0px;\n border-bottom-left-radius: 0px;\n}\n.tw-tab:is(input[type=\"radio\"]):after {\n --tw-content: attr(aria-label);\n content: var(--tw-content);\n}\n.tw-tab:not(input):empty {\n cursor: default;\n grid-column-start: span 9999;\n}\n.tw-tab-content {\n grid-column-start: 1;\n grid-column-end: span 9999;\n grid-row-start: 2;\n margin-top: calc(var(--tab-border) * -1);\n display: none;\n border-color: transparent;\n border-width: var(--tab-border, 0);\n}\n:checked + .tw-tab-content:nth-child(2),\n :is(.tw-tab-active, [aria-selected=\"true\"]) + .tw-tab-content:nth-child(2) {\n border-start-start-radius: 0px;\n}\ninput.tw-tab:checked + .tw-tab-content,\n:is(.tw-tab-active, [aria-selected=\"true\"]) + .tw-tab-content {\n display: block;\n}\n.tw-table {\n position: relative;\n width: 100%;\n border-radius: var(--rounded-box, 1rem);\n text-align: left;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-table :where(.tw-table-pin-rows thead tr) {\n position: sticky;\n top: 0px;\n z-index: 1;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-table :where(.tw-table-pin-rows tfoot tr) {\n position: sticky;\n bottom: 0px;\n z-index: 1;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-table :where(.tw-table-pin-cols tr th) {\n position: sticky;\n left: 0px;\n right: 0px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-textarea {\n min-height: 3rem;\n flex-shrink: 1;\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-avatar-group :where(.tw-avatar) {\n overflow: hidden;\n border-radius: 9999px;\n border-width: 4px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-border-opacity)));\n}\n.tw-badge-success {\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-suc,oklch(var(--suc)/var(--tw-text-opacity)));\n}\n.tw-badge-outline.tw-badge-success {\n --tw-text-opacity: 1;\n color: var(--fallback-su,oklch(var(--su)/var(--tw-text-opacity)));\n}\n.tw-btm-nav > * .tw-label {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-breadcrumbs > ul > li > a:focus, .tw-breadcrumbs > ol > li > a:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-breadcrumbs > ul > li > a:focus-visible, .tw-breadcrumbs > ol > li > a:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n}\n.tw-breadcrumbs > ul > li + *:before, .tw-breadcrumbs > ol > li + *:before {\n content: \"\";\n margin-left: 0.5rem;\n margin-right: 0.75rem;\n display: block;\n height: 0.375rem;\n width: 0.375rem;\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0.4;\n border-top: 1px solid;\n border-right: 1px solid;\n background-color: transparent;\n}\n[dir=\"rtl\"] .tw-breadcrumbs > ul > li + *:before,\n[dir=\"rtl\"] .tw-breadcrumbs > ol > li + *:before {\n --tw-rotate: -135deg;\n}\n@media (prefers-reduced-motion: no-preference) {\n\n .tw-btn {\n animation: button-pop var(--animation-btn, 0.25s) ease-out;\n }\n}\n.tw-btn:active:hover,\n .tw-btn:active:focus {\n animation: button-pop 0s ease-out;\n transform: scale(var(--btn-focus-scale, 0.97));\n}\n@supports not (color: oklch(0% 0 0)) {\n\n .tw-btn {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n\n .tw-btn-primary {\n --btn-color: var(--fallback-p);\n }\n\n .tw-btn-neutral {\n --btn-color: var(--fallback-n);\n }\n\n .tw-btn-error {\n --btn-color: var(--fallback-er);\n }\n}\n@supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary.tw-btn-active {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n\n .tw-btn-outline.tw-btn-error.tw-btn-active {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n}\n.tw-btn:focus-visible {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n}\n.tw-btn-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-p,oklch(var(--p)/1));\n}\n@supports (color: oklch(0% 0 0)) {\n\n .tw-btn-primary {\n --btn-color: var(--p);\n }\n\n .tw-btn-neutral {\n --btn-color: var(--n);\n }\n\n .tw-btn-error {\n --btn-color: var(--er);\n }\n}\n.tw-btn-neutral {\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-n,oklch(var(--n)/1));\n}\n.tw-btn-error {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-er,oklch(var(--er)/1));\n}\n.tw-btn.tw-glass {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: currentColor;\n}\n.tw-btn.tw-glass.tw-btn-active {\n --glass-opacity: 25%;\n --glass-border-opacity: 15%;\n}\n.tw-btn-ghost {\n border-width: 1px;\n border-color: transparent;\n background-color: transparent;\n color: currentColor;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: currentColor;\n}\n.tw-btn-ghost.tw-btn-active {\n border-color: transparent;\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-btn-outline.tw-btn-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-primary.tw-btn-active {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-error {\n --tw-text-opacity: 1;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-error.tw-btn-active {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n}\n.tw-btn.tw-btn-disabled,\n .tw-btn[disabled],\n .tw-btn:disabled {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-btn:is(input[type=\"checkbox\"]:checked),\n.tw-btn:is(input[type=\"radio\"]:checked) {\n --tw-border-opacity: 1;\n border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n}\n.tw-btn:is(input[type=\"checkbox\"]:checked):focus-visible, .tw-btn:is(input[type=\"radio\"]:checked):focus-visible {\n outline-color: var(--fallback-p,oklch(var(--p)/1));\n}\n@keyframes button-pop {\n\n 0% {\n transform: scale(var(--btn-focus-scale, 0.98));\n }\n\n 40% {\n transform: scale(1.02);\n }\n\n 100% {\n transform: scale(1);\n }\n}\n.tw-card :where(figure:first-child) {\n overflow: hidden;\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n border-end-start-radius: unset;\n border-end-end-radius: unset;\n}\n.tw-card :where(figure:last-child) {\n overflow: hidden;\n border-start-start-radius: unset;\n border-start-end-radius: unset;\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n}\n.tw-card:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n}\n.tw-card.tw-bordered {\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-card.tw-compact .tw-card-body {\n padding: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-card-title {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n}\n.tw-card.tw-image-full :where(figure) {\n overflow: hidden;\n border-radius: inherit;\n}\n.tw-checkbox:focus {\n box-shadow: none;\n}\n.tw-checkbox:focus-visible {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n.tw-checkbox:disabled {\n border-width: 0px;\n cursor: not-allowed;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.2;\n}\n.tw-checkbox:checked,\n .tw-checkbox[aria-checked=\"true\"] {\n background-repeat: no-repeat;\n animation: checkmark var(--animation-input, 0.2s) ease-out;\n background-color: var(--chkbg);\n background-image: linear-gradient(-45deg, transparent 65%, var(--chkbg) 65.99%),\n linear-gradient(45deg, transparent 75%, var(--chkbg) 75.99%),\n linear-gradient(-45deg, var(--chkbg) 40%, transparent 40.99%),\n linear-gradient(\n 45deg,\n var(--chkbg) 30%,\n var(--chkfg) 30.99%,\n var(--chkfg) 40%,\n transparent 40.99%\n ),\n linear-gradient(-45deg, var(--chkfg) 50%, var(--chkbg) 50.99%);\n}\n.tw-checkbox:indeterminate {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n background-repeat: no-repeat;\n animation: checkmark var(--animation-input, 0.2s) ease-out;\n background-image: linear-gradient(90deg, transparent 80%, var(--chkbg) 80%),\n linear-gradient(-90deg, transparent 80%, var(--chkbg) 80%),\n linear-gradient(0deg, var(--chkbg) 43%, var(--chkfg) 43%, var(--chkfg) 57%, var(--chkbg) 57%);\n}\n.tw-checkbox-success {\n --chkbg: var(--fallback-su,oklch(var(--su)/1));\n --chkfg: var(--fallback-suc,oklch(var(--suc)/1));\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n}\n.tw-checkbox-success:focus-visible {\n outline-color: var(--fallback-su,oklch(var(--su)/1));\n}\n.tw-checkbox-success:checked,\n .tw-checkbox-success[aria-checked=\"true\"] {\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-suc,oklch(var(--suc)/var(--tw-text-opacity)));\n}\n@keyframes checkmark {\n\n 0% {\n background-position-y: 5px;\n }\n\n 50% {\n background-position-y: -2px;\n }\n\n 100% {\n background-position-y: 0;\n }\n}\n.tw-divider:not(:empty) {\n gap: 1rem;\n}\n.tw-dropdown.tw-dropdown-open .tw-dropdown-content,\n.tw-dropdown:focus .tw-dropdown-content,\n.tw-dropdown:focus-within .tw-dropdown-content {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-file-input:focus {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-file-input-disabled,\n .tw-file-input[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-file-input-disabled::-moz-placeholder, .tw-file-input[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-file-input-disabled::placeholder,\n .tw-file-input[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-file-input-disabled::file-selector-button, .tw-file-input[disabled]::file-selector-button {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-label-text {\n font-size: 0.875rem;\n line-height: 1.25rem;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n}\n.tw-input input {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));\n background-color: transparent;\n}\n.tw-input input:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-input[list]::-webkit-calendar-picker-indicator {\n line-height: 1em;\n}\n.tw-input-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-input:focus,\n .tw-input:focus-within {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-input:has(> input[disabled]),\n .tw-input-disabled,\n .tw-input:disabled,\n .tw-input[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-input:has(> input[disabled])::-moz-placeholder, .tw-input-disabled::-moz-placeholder, .tw-input:disabled::-moz-placeholder, .tw-input[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-input:has(> input[disabled])::placeholder,\n .tw-input-disabled::placeholder,\n .tw-input:disabled::placeholder,\n .tw-input[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-input:has(> input[disabled]) > input[disabled] {\n cursor: not-allowed;\n}\n.tw-input::-webkit-date-and-time-value {\n text-align: inherit;\n}\n.tw-join > :where(*:not(:first-child)):is(.tw-btn) {\n margin-inline-start: calc(var(--border-btn) * -1);\n}\n.tw-loading {\n pointer-events: none;\n display: inline-block;\n aspect-ratio: 1 / 1;\n width: 1.5rem;\n background-color: currentColor;\n -webkit-mask-size: 100%;\n mask-size: 100%;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-position: center;\n mask-position: center;\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n}\n.tw-loading-spinner {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n}\n.tw-loading-sm {\n width: 1.25rem;\n}\n.tw-loading-md {\n width: 1.5rem;\n}\n.tw-mask-squircle {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e\");\n}\n.tw-mask-decagon {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='192' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z' fill-rule='evenodd'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='192' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z' fill-rule='evenodd'/%3e%3c/svg%3e\");\n}\n.tw-mask-hexagon-2 {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='182' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z' fill='black' fill-rule='nonzero'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='182' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z' fill='black' fill-rule='nonzero'/%3e%3c/svg%3e\");\n}\n.tw-mask-circle {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle fill='black' cx='100' cy='100' r='100' fill-rule='evenodd'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle fill='black' cx='100' cy='100' r='100' fill-rule='evenodd'/%3e%3c/svg%3e\");\n}\n:where(.tw-menu li:empty) {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.1;\n margin: 0.5rem 1rem;\n height: 1px;\n}\n.tw-menu :where(li ul):before {\n position: absolute;\n bottom: 0.75rem;\n inset-inline-start: 0px;\n top: 0.75rem;\n width: 1px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.1;\n content: \"\";\n}\n.tw-menu :where(li:not(.tw-menu-title) > *:not(ul, details, .tw-menu-title, .tw-btn)),\n.tw-menu :where(li:not(.tw-menu-title) > details > summary:not(.tw-menu-title)) {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n border-radius: var(--rounded-btn, 0.5rem);\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n text-align: start;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n text-wrap: balance;\n}\n:where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(summary, .tw-active, .tw-btn).tw-focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(summary, .tw-active, .tw-btn):focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):is(summary):not(.tw-active, .tw-btn):focus-visible, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(summary, .tw-active, .tw-btn).tw-focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(summary, .tw-active, .tw-btn):focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):is(summary):not(.tw-active, .tw-btn):focus-visible {\n cursor: pointer;\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn):active,\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn).tw-active,\n.tw-menu li > details > summary:active {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n}\n.tw-menu :where(li > details > summary)::-webkit-details-marker {\n display: none;\n}\n.tw-menu :where(li > details > summary):after,\n.tw-menu :where(li > .tw-menu-dropdown-toggle):after {\n justify-self: end;\n display: block;\n margin-top: -0.5rem;\n height: 0.5rem;\n width: 0.5rem;\n transform: rotate(45deg);\n transition-property: transform, margin-top;\n transition-duration: 0.3s;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n content: \"\";\n transform-origin: 75% 75%;\n box-shadow: 2px 2px;\n pointer-events: none;\n}\n.tw-menu :where(li > details[open] > summary):after,\n.tw-menu :where(li > .tw-menu-dropdown-toggle.tw-menu-dropdown-show):after {\n transform: rotate(225deg);\n margin-top: 0;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input {\n position: relative;\n margin-left: auto;\n margin-right: auto;\n display: block;\n height: 1.75rem;\n width: 24rem;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n padding-left: 2rem;\n direction: ltr;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input:before {\n content: \"\";\n position: absolute;\n left: 0.5rem;\n top: 50%;\n aspect-ratio: 1 / 1;\n height: 0.75rem;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-radius: 9999px;\n border-width: 2px;\n border-color: currentColor;\n opacity: 0.6;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input:after {\n content: \"\";\n position: absolute;\n left: 1.25rem;\n top: 50%;\n height: 0.5rem;\n --tw-translate-y: 25%;\n --tw-rotate: -45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-radius: 9999px;\n border-width: 1px;\n border-color: currentColor;\n opacity: 0.6;\n}\n.tw-modal:not(dialog:not(.tw-modal-open)),\n .tw-modal::backdrop {\n background-color: #0006;\n animation: modal-pop 0.2s ease-out;\n}\n.tw-modal-backdrop {\n z-index: -1;\n grid-column-start: 1;\n grid-row-start: 1;\n display: grid;\n align-self: stretch;\n justify-self: stretch;\n color: transparent;\n}\n.tw-modal-open .tw-modal-box,\n.tw-modal-toggle:checked + .tw-modal .tw-modal-box,\n.tw-modal:target .tw-modal-box,\n.tw-modal[open] .tw-modal-box {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes modal-pop {\n\n 0% {\n opacity: 0;\n }\n}\n@keyframes progress-loading {\n\n 50% {\n background-position-x: -115%;\n }\n}\n@keyframes radiomark {\n\n 0% {\n box-shadow: 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n\n 50% {\n box-shadow: 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n\n 100% {\n box-shadow: 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n}\n@keyframes rating-pop {\n\n 0% {\n transform: translateY(-0.125em);\n }\n\n 40% {\n transform: translateY(-0.125em);\n }\n\n 100% {\n transform: translateY(0);\n }\n}\n.tw-select-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-select:focus {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-select-disabled,\n .tw-select:disabled,\n .tw-select[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-select-disabled::-moz-placeholder, .tw-select:disabled::-moz-placeholder, .tw-select[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-select-disabled::placeholder,\n .tw-select:disabled::placeholder,\n .tw-select[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-select-multiple,\n .tw-select[multiple],\n .tw-select[size].tw-select:not([size=\"1\"]) {\n background-image: none;\n padding-right: 1rem;\n}\n[dir=\"rtl\"] .tw-select {\n background-position: calc(0% + 12px) calc(1px + 50%),\n calc(0% + 16px) calc(1px + 50%);\n}\n@keyframes skeleton {\n\n from {\n background-position: 150%;\n }\n\n to {\n background-position: -50%;\n }\n}\n.tw-tabs-lifted > .tw-tab:focus-visible {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n}\n.tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]), .tw-tab:is(input:checked) {\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 1;\n --tw-text-opacity: 1;\n}\n.tw-tab:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-tab:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: -5px;\n}\n.tw-tab-disabled,\n .tw-tab[disabled] {\n cursor: not-allowed;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-tabs-bordered > .tw-tab {\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0.2;\n border-style: solid;\n border-bottom-width: calc(var(--tab-border, 1px) + 1px);\n}\n.tw-tabs-lifted > .tw-tab {\n border: var(--tab-border, 1px) solid transparent;\n border-width: 0 0 var(--tab-border, 1px) 0;\n border-start-start-radius: var(--tab-radius, 0.5rem);\n border-start-end-radius: var(--tab-radius, 0.5rem);\n border-bottom-color: var(--tab-border-color);\n padding-inline-start: var(--tab-padding, 1rem);\n padding-inline-end: var(--tab-padding, 1rem);\n padding-top: var(--tab-border, 1px);\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]), .tw-tabs-lifted > .tw-tab:is(input:checked) {\n background-color: var(--tab-bg);\n border-width: var(--tab-border, 1px) var(--tab-border, 1px) 0 var(--tab-border, 1px);\n border-inline-start-color: var(--tab-border-color);\n border-inline-end-color: var(--tab-border-color);\n border-top-color: var(--tab-border-color);\n padding-inline-start: calc(var(--tab-padding, 1rem) - var(--tab-border, 1px));\n padding-inline-end: calc(var(--tab-padding, 1rem) - var(--tab-border, 1px));\n padding-bottom: var(--tab-border, 1px);\n padding-top: 0;\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):before, .tw-tabs-lifted > .tw-tab:is(input:checked):before {\n z-index: 1;\n content: \"\";\n display: block;\n position: absolute;\n width: calc(100% + var(--tab-radius, 0.5rem) * 2);\n height: var(--tab-radius, 0.5rem);\n bottom: 0;\n background-size: var(--tab-radius, 0.5rem);\n background-position: top left,\n top right;\n background-repeat: no-repeat;\n --tab-grad: calc(69% - var(--tab-border, 1px));\n --radius-start: radial-gradient(\n circle at top left,\n transparent var(--tab-grad),\n var(--tab-border-color) calc(var(--tab-grad) + 0.25px),\n var(--tab-border-color) calc(var(--tab-grad) + var(--tab-border, 1px)),\n var(--tab-bg) calc(var(--tab-grad) + var(--tab-border, 1px) + 0.25px)\n );\n --radius-end: radial-gradient(\n circle at top right,\n transparent var(--tab-grad),\n var(--tab-border-color) calc(var(--tab-grad) + 0.25px),\n var(--tab-border-color) calc(var(--tab-grad) + var(--tab-border, 1px)),\n var(--tab-bg) calc(var(--tab-grad) + var(--tab-border, 1px) + 0.25px)\n );\n background-image: var(--radius-start), var(--radius-end);\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):first-child:before, .tw-tabs-lifted > .tw-tab:is(input:checked):first-child:before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n[dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):first-child:before, [dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(input:checked):first-child:before {\n background-image: var(--radius-start);\n background-position: top left;\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):last-child:before, .tw-tabs-lifted > .tw-tab:is(input:checked):last-child:before {\n background-image: var(--radius-start);\n background-position: top left;\n}\n[dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):last-child:before, [dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(input:checked):last-child:before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n.tw-tabs-lifted\n > :is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled])\n + .tw-tabs-lifted\n :is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):before, .tw-tabs-lifted > .tw-tab:is(input:checked) + .tw-tabs-lifted .tw-tab:is(input:checked):before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n.tw-tabs-boxed .tw-tab {\n border-radius: var(--rounded-btn, 0.5rem);\n}\n.tw-table:where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n text-align: right;\n}\n.tw-table :where(th, td) {\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n vertical-align: middle;\n}\n.tw-table tr.tw-active,\n .tw-table tr.tw-active:nth-child(even),\n .tw-table-zebra tbody tr:nth-child(even) {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n}\n.tw-table :where(thead tr, tbody tr:not(:last-child), tbody tr:first-child:last-child) {\n border-bottom-width: 1px;\n --tw-border-opacity: 1;\n border-bottom-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-table :where(thead, tfoot) {\n white-space: nowrap;\n font-size: 0.75rem;\n line-height: 1rem;\n font-weight: 700;\n color: var(--fallback-bc,oklch(var(--bc)/0.6));\n}\n.tw-table :where(tfoot) {\n border-top-width: 1px;\n --tw-border-opacity: 1;\n border-top-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-textarea-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-textarea:focus {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-textarea-disabled,\n .tw-textarea:disabled,\n .tw-textarea[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-textarea-disabled::-moz-placeholder, .tw-textarea:disabled::-moz-placeholder, .tw-textarea[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-textarea-disabled::placeholder,\n .tw-textarea:disabled::placeholder,\n .tw-textarea[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n@keyframes toast-pop {\n\n 0% {\n transform: scale(0.9);\n opacity: 0;\n }\n\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n.tw-btn-xs {\n height: 1.5rem;\n min-height: 1.5rem;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n font-size: 0.75rem;\n}\n.tw-btn-sm {\n height: 2rem;\n min-height: 2rem;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n font-size: 0.875rem;\n}\n.tw-btn-lg {\n height: 4rem;\n min-height: 4rem;\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n font-size: 1.125rem;\n}\n.tw-btn-block {\n width: 100%;\n}\n.tw-btn-square:where(.tw-btn-xs) {\n height: 1.5rem;\n width: 1.5rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-sm) {\n height: 2rem;\n width: 2rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-md) {\n height: 3rem;\n width: 3rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-lg) {\n height: 4rem;\n width: 4rem;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-xs) {\n height: 1.5rem;\n width: 1.5rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-sm) {\n height: 2rem;\n width: 2rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-md) {\n height: 3rem;\n width: 3rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-lg) {\n height: 4rem;\n width: 4rem;\n border-radius: 9999px;\n padding: 0px;\n}\n[type=\"checkbox\"].tw-checkbox-xs {\n height: 1rem;\n width: 1rem;\n}\n[type=\"checkbox\"].tw-checkbox-sm {\n height: 1.25rem;\n width: 1.25rem;\n}\n.tw-indicator :where(.tw-indicator-item) {\n bottom: auto;\n inset-inline-end: 0px;\n inset-inline-start: auto;\n top: 0px;\n --tw-translate-y: -50%;\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-start) {\n inset-inline-end: auto;\n inset-inline-start: 0px;\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-start):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-center) {\n inset-inline-end: 50%;\n inset-inline-start: 50%;\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-center):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-end) {\n inset-inline-end: 0px;\n inset-inline-start: auto;\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-end):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-bottom) {\n bottom: 0px;\n top: auto;\n --tw-translate-y: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-middle) {\n bottom: 50%;\n top: 50%;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-top) {\n bottom: auto;\n top: 0px;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-input-md {\n height: 3rem;\n padding-left: 1rem;\n padding-right: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n}\n.tw-input-sm {\n height: 2rem;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n font-size: 0.875rem;\n line-height: 2rem;\n}\n.tw-tabs-md :where(.tw-tab) {\n height: 2rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n --tab-padding: 1rem;\n}\n.tw-tabs-lg :where(.tw-tab) {\n height: 3rem;\n font-size: 1.125rem;\n line-height: 1.75rem;\n line-height: 2;\n --tab-padding: 1.25rem;\n}\n.tw-tabs-sm :where(.tw-tab) {\n height: 1.5rem;\n font-size: 0.875rem;\n line-height: .75rem;\n --tab-padding: 0.75rem;\n}\n.tw-tabs-xs :where(.tw-tab) {\n height: 1.25rem;\n font-size: 0.75rem;\n line-height: .75rem;\n --tab-padding: 0.5rem;\n}\n.tw-tooltip {\n position: relative;\n display: inline-block;\n --tooltip-offset: calc(100% + 1px + var(--tooltip-tail, 0px));\n}\n.tw-tooltip:before {\n position: absolute;\n pointer-events: none;\n z-index: 1;\n content: var(--tw-content);\n --tw-content: attr(data-tip);\n}\n.tw-tooltip:before, .tw-tooltip-top:before {\n transform: translateX(-50%);\n top: auto;\n left: 50%;\n right: auto;\n bottom: var(--tooltip-offset);\n}\n.tw-tooltip-left:before {\n transform: translateY(-50%);\n top: 50%;\n left: auto;\n right: var(--tooltip-offset);\n bottom: auto;\n}\n.tw-tooltip-right:before {\n transform: translateY(-50%);\n top: 50%;\n left: var(--tooltip-offset);\n right: auto;\n bottom: auto;\n}\n.tw-avatar.tw-online:before {\n content: \"\";\n position: absolute;\n z-index: 10;\n display: block;\n border-radius: 9999px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n outline-style: solid;\n outline-width: 2px;\n outline-color: var(--fallback-b1,oklch(var(--b1)/1));\n width: 15%;\n height: 15%;\n top: 7%;\n right: 7%;\n}\n.tw-avatar.tw-offline:before {\n content: \"\";\n position: absolute;\n z-index: 10;\n display: block;\n border-radius: 9999px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n outline-style: solid;\n outline-width: 2px;\n outline-color: var(--fallback-b1,oklch(var(--b1)/1));\n width: 15%;\n height: 15%;\n top: 7%;\n right: 7%;\n}\n.tw-card-compact .tw-card-body {\n padding: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-card-compact .tw-card-title {\n margin-bottom: 0.25rem;\n}\n.tw-card-normal .tw-card-body {\n padding: var(--padding-card, 2rem);\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-card-normal .tw-card-title {\n margin-bottom: 0.75rem;\n}\n.tw-join.tw-join-vertical > :where(*:not(:first-child)):is(.tw-btn) {\n margin-top: calc(var(--border-btn) * -1);\n}\n.tw-join.tw-join-horizontal > :where(*:not(:first-child)):is(.tw-btn) {\n margin-inline-start: calc(var(--border-btn) * -1);\n margin-top: 0px;\n}\n.tw-modal-top :where(.tw-modal-box) {\n width: 100%;\n max-width: none;\n --tw-translate-y: -2.5rem;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n border-top-left-radius: 0px;\n border-top-right-radius: 0px;\n}\n.tw-modal-middle :where(.tw-modal-box) {\n width: 91.666667%;\n max-width: 32rem;\n --tw-translate-y: 0px;\n --tw-scale-x: .9;\n --tw-scale-y: .9;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n}\n.tw-modal-bottom :where(.tw-modal-box) {\n width: 100%;\n max-width: none;\n --tw-translate-y: 2.5rem;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n border-bottom-right-radius: 0px;\n border-bottom-left-radius: 0px;\n}\n.tw-tooltip {\n position: relative;\n display: inline-block;\n text-align: center;\n --tooltip-tail: 0.1875rem;\n --tooltip-color: var(--fallback-n,oklch(var(--n)/1));\n --tooltip-text-color: var(--fallback-nc,oklch(var(--nc)/1));\n --tooltip-tail-offset: calc(100% + 0.0625rem - var(--tooltip-tail));\n}\n.tw-tooltip:before,\n.tw-tooltip:after {\n opacity: 0;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-delay: 100ms;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n.tw-tooltip:after {\n position: absolute;\n content: \"\";\n border-style: solid;\n border-width: var(--tooltip-tail, 0);\n width: 0;\n height: 0;\n display: block;\n}\n.tw-tooltip:before {\n max-width: 20rem;\n white-space: normal;\n border-radius: 0.25rem;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n background-color: var(--tooltip-color);\n color: var(--tooltip-text-color);\n width: -moz-max-content;\n width: max-content;\n}\n.tw-tooltip.tw-tooltip-open:before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip.tw-tooltip-open:after {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:hover:before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:hover:after {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:has(:focus-visible):after,\n.tw-tooltip:has(:focus-visible):before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:not([data-tip]):hover:before,\n.tw-tooltip:not([data-tip]):hover:after {\n visibility: hidden;\n opacity: 0;\n}\n.tw-tooltip:after, .tw-tooltip-top:after {\n transform: translateX(-50%);\n border-color: var(--tooltip-color) transparent transparent transparent;\n top: auto;\n left: 50%;\n right: auto;\n bottom: var(--tooltip-tail-offset);\n}\n.tw-tooltip-left:after {\n transform: translateY(-50%);\n border-color: transparent transparent transparent var(--tooltip-color);\n top: 50%;\n left: auto;\n right: calc(var(--tooltip-tail-offset) + 0.0625rem);\n bottom: auto;\n}\n.tw-tooltip-right:after {\n transform: translateY(-50%);\n border-color: transparent var(--tooltip-color) transparent transparent;\n top: 50%;\n left: calc(var(--tooltip-tail-offset) + 0.0625rem);\n right: auto;\n bottom: auto;\n}\n.tw-pointer-events-none {\n pointer-events: none;\n}\n.tw-pointer-events-auto {\n pointer-events: auto;\n}\n.tw-fixed {\n position: fixed;\n}\n.tw-absolute {\n position: absolute;\n}\n.tw-relative {\n position: relative;\n}\n.tw-inset-y-0 {\n top: 0px;\n bottom: 0px;\n}\n.\\!tw-bottom-24 {\n bottom: 6rem !important;\n}\n.\\!tw-left-0 {\n left: 0px !important;\n}\n.\\!tw-left-auto {\n left: auto !important;\n}\n.-tw-left-6 {\n left: -1.5rem;\n}\n.tw--right-2 {\n right: -0.5rem;\n}\n.tw--top-2 {\n top: -0.5rem;\n}\n.tw-bottom-0 {\n bottom: 0px;\n}\n.tw-bottom-4 {\n bottom: 1rem;\n}\n.tw-left-0 {\n left: 0px;\n}\n.tw-left-1\\/2 {\n left: 50%;\n}\n.tw-left-4 {\n left: 1rem;\n}\n.tw-right-0 {\n right: 0px;\n}\n.tw-right-1 {\n right: 0.25rem;\n}\n.tw-right-2 {\n right: 0.5rem;\n}\n.tw-right-4 {\n right: 1rem;\n}\n.tw-right-5 {\n right: 1.25rem;\n}\n.tw-top-0 {\n top: 0px;\n}\n.tw-top-1 {\n top: 0.25rem;\n}\n.tw-top-14 {\n top: 3.5rem;\n}\n.tw-top-2 {\n top: 0.5rem;\n}\n.tw-top-4 {\n top: 1rem;\n}\n.\\!tw-z-\\[10000\\] {\n z-index: 10000 !important;\n}\n.tw-z-1000 {\n z-index: 1000;\n}\n.tw-z-3000 {\n z-index: 3000;\n}\n.tw-z-500 {\n z-index: 500;\n}\n.tw-z-\\[10000\\] {\n z-index: 10000;\n}\n.tw-z-\\[10035\\] {\n z-index: 10035;\n}\n.tw-z-\\[2000\\] {\n z-index: 2000;\n}\n.tw-z-\\[4000\\] {\n z-index: 4000;\n}\n.tw-z-\\[9998\\] {\n z-index: 9998;\n}\n.tw-z-\\[999\\] {\n z-index: 999;\n}\n.tw-col-span-1 {\n grid-column: span 1 / span 1;\n}\n.tw-float-right {\n float: right;\n}\n.tw-float-left {\n float: left;\n}\n.tw-m-1 {\n margin: 0.25rem;\n}\n.tw-m-4 {\n margin: 1rem;\n}\n.tw-m-auto {\n margin: auto;\n}\n.\\!tw-my-0 {\n margin-top: 0px !important;\n margin-bottom: 0px !important;\n}\n.\\!tw-my-2 {\n margin-top: 0.5rem !important;\n margin-bottom: 0.5rem !important;\n}\n.-tw-mx-4 {\n margin-left: -1rem;\n margin-right: -1rem;\n}\n.tw-mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n}\n.tw-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.tw-mx-6 {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n}\n.tw-mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n.tw-my-1 {\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n}\n.tw-my-10 {\n margin-top: 2.5rem;\n margin-bottom: 2.5rem;\n}\n.tw-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.-tw-mb-1 {\n margin-bottom: -0.25rem;\n}\n.-tw-mb-2 {\n margin-bottom: -0.5rem;\n}\n.-tw-mb-4 {\n margin-bottom: -1rem;\n}\n.-tw-mr-4 {\n margin-right: -1rem;\n}\n.-tw-mr-6 {\n margin-right: -1.5rem;\n}\n.-tw-mt-2 {\n margin-top: -0.5rem;\n}\n.tw-mb-0 {\n margin-bottom: 0px;\n}\n.tw-mb-1 {\n margin-bottom: 0.25rem;\n}\n.tw-mb-10 {\n margin-bottom: 2.5rem;\n}\n.tw-mb-2 {\n margin-bottom: 0.5rem;\n}\n.tw-mb-3 {\n margin-bottom: 0.75rem;\n}\n.tw-mb-4 {\n margin-bottom: 1rem;\n}\n.tw-mb-6 {\n margin-bottom: 1.5rem;\n}\n.tw-ml-1 {\n margin-left: 0.25rem;\n}\n.tw-ml-2 {\n margin-left: 0.5rem;\n}\n.tw-mr-1 {\n margin-right: 0.25rem;\n}\n.tw-mr-2 {\n margin-right: 0.5rem;\n}\n.tw-mr-4 {\n margin-right: 1rem;\n}\n.tw-mr-5 {\n margin-right: 1.25rem;\n}\n.tw-mt-0 {\n margin-top: 0px;\n}\n.tw-mt-1 {\n margin-top: 0.25rem;\n}\n.tw-mt-1\\.5 {\n margin-top: 0.375rem;\n}\n.tw-mt-12 {\n margin-top: 3rem;\n}\n.tw-mt-16 {\n margin-top: 4rem;\n}\n.tw-mt-2 {\n margin-top: 0.5rem;\n}\n.tw-mt-3 {\n margin-top: 0.75rem;\n}\n.tw-mt-4 {\n margin-top: 1rem;\n}\n.tw-mt-5 {\n margin-top: 1.25rem;\n}\n.tw-mt-6 {\n margin-top: 1.5rem;\n}\n.tw-mt-8 {\n margin-top: 2rem;\n}\n.tw-block {\n display: block;\n}\n.tw-inline-block {\n display: inline-block;\n}\n.tw-inline {\n display: inline;\n}\n.tw-flex {\n display: flex;\n}\n.tw-inline-flex {\n display: inline-flex;\n}\n.tw-table {\n display: table;\n}\n.tw-grid {\n display: grid;\n}\n.tw-hidden {\n display: none;\n}\n.tw-h-10 {\n height: 2.5rem;\n}\n.tw-h-12 {\n height: 3rem;\n}\n.tw-h-20 {\n height: 5rem;\n}\n.tw-h-24 {\n height: 6rem;\n}\n.tw-h-28 {\n height: 7rem;\n}\n.tw-h-3 {\n height: 0.75rem;\n}\n.tw-h-3\\/4 {\n height: 75%;\n}\n.tw-h-32 {\n height: 8rem;\n}\n.tw-h-4 {\n height: 1rem;\n}\n.tw-h-40 {\n height: 10rem;\n}\n.tw-h-48 {\n height: 12rem;\n}\n.tw-h-5 {\n height: 1.25rem;\n}\n.tw-h-6 {\n height: 1.5rem;\n}\n.tw-h-8 {\n height: 2rem;\n}\n.tw-h-96 {\n height: 24rem;\n}\n.tw-h-\\[100dvh\\] {\n height: 100dvh;\n}\n.tw-h-\\[calc\\(100\\%-1rem\\)\\] {\n height: calc(100% - 1rem);\n}\n.tw-h-\\[calc\\(100dvh-268px\\)\\] {\n height: calc(100dvh - 268px);\n}\n.tw-h-\\[calc\\(100dvh-280px\\)\\] {\n height: calc(100dvh - 280px);\n}\n.tw-h-\\[calc\\(100dvh-332px\\)\\] {\n height: calc(100dvh - 332px);\n}\n.tw-h-\\[calc\\(100dvh-64px\\)\\] {\n height: calc(100dvh - 64px);\n}\n.tw-h-\\[calc\\(50\\%-0\\.75em\\)\\] {\n height: calc(50% - 0.75em);\n}\n.tw-h-\\[calc\\(50\\%-1\\.5em\\)\\] {\n height: calc(50% - 1.5em);\n}\n.tw-h-fit {\n height: -moz-fit-content;\n height: fit-content;\n}\n.tw-h-full {\n height: 100%;\n}\n.tw-max-h-64 {\n max-height: 16rem;\n}\n.tw-max-h-\\[calc\\(100dvh-152px\\)\\] {\n max-height: calc(100dvh - 152px);\n}\n.tw-max-h-\\[calc\\(100dvh-96px\\)\\] {\n max-height: calc(100dvh - 96px);\n}\n.tw-min-h-0 {\n min-height: 0px;\n}\n.tw-min-h-56 {\n min-height: 224px;\n}\n.tw-min-h-80 {\n min-height: 320px;\n}\n.tw-min-h-\\[21px\\] {\n min-height: 21px;\n}\n.tw-min-h-\\[5em\\] {\n min-height: 5em;\n}\n.tw-w-1 {\n width: 0.25rem;\n}\n.tw-w-10 {\n width: 2.5rem;\n}\n.tw-w-12 {\n width: 3rem;\n}\n.tw-w-20 {\n width: 5rem;\n}\n.tw-w-28 {\n width: 7rem;\n}\n.tw-w-4 {\n width: 1rem;\n}\n.tw-w-48 {\n width: 12rem;\n}\n.tw-w-5 {\n width: 1.25rem;\n}\n.tw-w-52 {\n width: 13rem;\n}\n.tw-w-6 {\n width: 1.5rem;\n}\n.tw-w-8 {\n width: 2rem;\n}\n.tw-w-80 {\n width: 20rem;\n}\n.tw-w-96 {\n width: 24rem;\n}\n.tw-w-\\[56px\\] {\n width: 56px;\n}\n.tw-w-\\[calc\\(100\\%-32px\\)\\] {\n width: calc(100% - 32px);\n}\n.tw-w-\\[calc\\(100vw-2rem\\)\\] {\n width: calc(100vw - 2rem);\n}\n.tw-w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\n.tw-w-full {\n width: 100%;\n}\n.tw-min-w-0 {\n min-width: 0px;\n}\n.tw-min-w-80 {\n min-width: 320px;\n}\n.tw-min-w-\\[10\\.4em\\] {\n min-width: 10.4em;\n}\n.tw-min-w-\\[10em\\] {\n min-width: 10em;\n}\n.tw-min-w-\\[8rem\\] {\n min-width: 8rem;\n}\n.tw-min-w-fit {\n min-width: -moz-fit-content;\n min-width: fit-content;\n}\n.tw-max-w-3xl {\n max-width: 48rem;\n}\n.tw-max-w-\\[17rem\\] {\n max-width: 17rem;\n}\n.tw-max-w-\\[22rem\\] {\n max-width: 22rem;\n}\n.tw-max-w-\\[calc\\(100\\%-60px\\)\\] {\n max-width: calc(100% - 60px);\n}\n.tw-max-w-full {\n max-width: 100%;\n}\n.tw-max-w-xl {\n max-width: 36rem;\n}\n.tw-max-w-xs {\n max-width: 20rem;\n}\n.tw-flex-1 {\n flex: 1 1 0%;\n}\n.tw-flex-none {\n flex: none;\n}\n.tw-flex-grow {\n flex-grow: 1;\n}\n.tw-grow {\n flex-grow: 1;\n}\n.tw-basis-1\\/5 {\n flex-basis: 20%;\n}\n.tw-basis-2\\/5 {\n flex-basis: 40%;\n}\n.-tw-translate-y-1\\/3 {\n --tw-translate-y: -33.333333%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw--translate-x-1\\/2 {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw--translate-x-full {\n --tw-translate-x: -100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-translate-x-0 {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-translate-x-1\\/3 {\n --tw-translate-x: 33.333333%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-rotate-180 {\n --tw-rotate: 180deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes tw-pulseGrow {\n\n 0%, 100% {\n transform: scale(1.00);\n }\n\n 80% {\n transform: scale(1.00);\n }\n\n 90% {\n transform: scale(0.95);\n }\n}\n.tw-animate-pulseGrow {\n animation: tw-pulseGrow 2s ease-in-out infinite;\n}\n.tw-cursor-pointer {\n cursor: pointer;\n}\n.tw-cursor-text {\n cursor: text;\n}\n.tw-resize-none {\n resize: none;\n}\n.tw-list-inside {\n list-style-position: inside;\n}\n.tw-list-decimal {\n list-style-type: decimal;\n}\n.tw-list-disc {\n list-style-type: disc;\n}\n.tw-list-none {\n list-style-type: none;\n}\n.tw-columns-1 {\n -moz-columns: 1;\n columns: 1;\n}\n.tw-break-inside-avoid {\n -moz-column-break-inside: avoid;\n break-inside: avoid;\n}\n.tw-grid-flow-col {\n grid-auto-flow: column;\n}\n.tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.tw-grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.tw-grid-cols-6 {\n grid-template-columns: repeat(6, minmax(0, 1fr));\n}\n.tw-flex-row {\n flex-direction: row;\n}\n.tw-flex-col {\n flex-direction: column;\n}\n.tw-flex-wrap {\n flex-wrap: wrap;\n}\n.tw-place-content-center {\n place-content: center;\n}\n.tw-place-content-end {\n place-content: end;\n}\n.tw-place-items-end {\n place-items: end;\n}\n.tw-place-items-center {\n place-items: center;\n}\n.tw-items-center {\n align-items: center;\n}\n.tw-justify-normal {\n justify-content: normal;\n}\n.tw-justify-end {\n justify-content: flex-end;\n}\n.tw-justify-center {\n justify-content: center;\n}\n.tw-justify-between {\n justify-content: space-between;\n}\n.tw-gap-2 {\n gap: 0.5rem;\n}\n.tw-gap-6 {\n gap: 1.5rem;\n}\n.tw-space-x-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.tw-space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.tw-space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.tw-space-y-6 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));\n}\n.tw-place-self-end {\n place-self: end;\n}\n.tw-place-self-center {\n place-self: center;\n}\n.tw-self-center {\n align-self: center;\n}\n.tw-overflow-auto {\n overflow: auto;\n}\n.tw-overflow-hidden {\n overflow: hidden;\n}\n.tw-overflow-scroll {\n overflow: scroll;\n}\n.tw-overflow-x-auto {\n overflow-x: auto;\n}\n.tw-overflow-y-auto {\n overflow-y: auto;\n}\n.tw-overflow-x-hidden {\n overflow-x: hidden;\n}\n.tw-truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.tw-text-ellipsis {\n text-overflow: ellipsis;\n}\n.tw-whitespace-nowrap {\n white-space: nowrap;\n}\n.\\!tw-rounded-none {\n border-radius: 0px !important;\n}\n.tw-rounded {\n border-radius: 0.25rem;\n}\n.tw-rounded-2xl {\n border-radius: 1rem;\n}\n.tw-rounded-box {\n border-radius: var(--rounded-box, 1rem);\n}\n.tw-rounded-full {\n border-radius: 9999px;\n}\n.tw-rounded-lg {\n border-radius: 0.5rem;\n}\n.tw-rounded-md {\n border-radius: 0.375rem;\n}\n.tw-rounded-none {\n border-radius: 0px;\n}\n.tw-rounded-xl {\n border-radius: 0.75rem;\n}\n.tw-rounded-br-md {\n border-bottom-right-radius: 0.375rem;\n}\n.tw-rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.tw-rounded-tr-md {\n border-top-right-radius: 0.375rem;\n}\n.tw-border {\n border-width: 1px;\n}\n.tw-border-0 {\n border-width: 0px;\n}\n.tw-border-4 {\n border-width: 4px;\n}\n.tw-border-\\[1px\\] {\n border-width: 1px;\n}\n.tw-border-t-0 {\n border-top-width: 0px;\n}\n.tw-border-none {\n border-style: none;\n}\n.tw-border-\\[var\\(--fallback-bc\\,oklch\\(var\\(--bc\\)\\/0\\.2\\)\\)\\] {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-border-base-200 {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity, 1)));\n}\n.tw-border-base-300 {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity, 1)));\n}\n.tw-border-current {\n border-color: currentColor;\n}\n.tw-border-gray-300 {\n --tw-border-opacity: 1;\n border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));\n}\n.tw-bg-\\[\\#369acc\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(54 154 204 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#95cf92\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(149 207 146 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#9656a2\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(150 86 162 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#A9DEF9\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(169 222 249 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#D0F4DE\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(208 244 222 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#E4C1F9\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(228 193 249 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#FCF6BD\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(252 246 189 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#FF99C8\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 153 200 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#de324c\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(222 50 76 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#f4895f\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(244 137 95 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#f8e16f\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(248 225 111 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#fff0d6\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 240 214 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-base-100 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-base-200 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-base-300 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-gray-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-neutral-content {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-nc,oklch(var(--nc)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-primary {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-slate-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-transparent {\n background-color: transparent;\n}\n.tw-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.tw-fill-current {\n fill: currentColor;\n}\n.tw-stroke-current {\n stroke: currentColor;\n}\n.tw-object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n}\n.\\!tw-p-0 {\n padding: 0px !important;\n}\n.\\!tw-p-4 {\n padding: 1rem !important;\n}\n.\\!tw-p-9 {\n padding: 2.25rem !important;\n}\n.tw-p-0 {\n padding: 0px;\n}\n.tw-p-1 {\n padding: 0.25rem;\n}\n.tw-p-2 {\n padding: 0.5rem;\n}\n.tw-p-3 {\n padding: 0.75rem;\n}\n.tw-p-4 {\n padding: 1rem;\n}\n.tw-p-6 {\n padding: 1.5rem;\n}\n.tw-p-\\[1px\\] {\n padding: 1px;\n}\n.tw-px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.tw-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.tw-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.tw-px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\n.tw-py-0\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n}\n.tw-py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.tw-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.\\!tw-pe-2 {\n padding-inline-end: 0.5rem !important;\n}\n.\\!tw-ps-2 {\n padding-inline-start: 0.5rem !important;\n}\n.tw-pb-0 {\n padding-bottom: 0px;\n}\n.tw-pb-1 {\n padding-bottom: 0.25rem;\n}\n.tw-pb-2 {\n padding-bottom: 0.5rem;\n}\n.tw-pb-4 {\n padding-bottom: 1rem;\n}\n.tw-pb-6 {\n padding-bottom: 1.5rem;\n}\n.tw-pl-2 {\n padding-left: 0.5rem;\n}\n.tw-pr-1 {\n padding-right: 0.25rem;\n}\n.tw-pr-12 {\n padding-right: 3rem;\n}\n.tw-pr-4 {\n padding-right: 1rem;\n}\n.tw-pt-0 {\n padding-top: 0px;\n}\n.tw-pt-1 {\n padding-top: 0.25rem;\n}\n.tw-pt-2 {\n padding-top: 0.5rem;\n}\n.tw-pt-4 {\n padding-top: 1rem;\n}\n.tw-pt-6 {\n padding-top: 1.5rem;\n}\n.tw-text-center {\n text-align: center;\n}\n.tw-text-right {\n text-align: right;\n}\n.tw-align-middle {\n vertical-align: middle;\n}\n.tw-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.tw-text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n}\n.tw-text-6xl {\n font-size: 3.75rem;\n line-height: 1;\n}\n.tw-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.tw-text-map {\n font-size: 13px;\n}\n.tw-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.tw-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.tw-font-bold {\n font-weight: 700;\n}\n.tw-font-medium {\n font-weight: 500;\n}\n.tw-font-normal {\n font-weight: 400;\n}\n.tw-font-semibold {\n font-weight: 600;\n}\n.tw-normal-case {\n text-transform: none;\n}\n.tw-italic {\n font-style: italic;\n}\n.tw-leading-3 {\n line-height: .75rem;\n}\n.tw-leading-5 {\n line-height: 1.25rem;\n}\n.tw-leading-map {\n line-height: 1.4em;\n}\n.\\!tw-text-base-content {\n --tw-text-opacity: 1 !important;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity, 1))) !important;\n}\n.\\!tw-text-error {\n --tw-text-opacity: 1 !important;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity, 1))) !important;\n}\n.tw-text-base-content {\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity, 1)));\n}\n.tw-text-current {\n color: currentColor;\n}\n.tw-text-error {\n --tw-text-opacity: 1;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity, 1)));\n}\n.tw-text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity, 1));\n}\n.tw-text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity, 1));\n}\n.tw-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.tw-text-green-500 {\n --tw-text-opacity: 1;\n color: rgb(34 197 94 / var(--tw-text-opacity, 1));\n}\n.tw-text-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity, 1)));\n}\n.tw-text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tw-text-zinc-500 {\n --tw-text-opacity: 1;\n color: rgb(113 113 122 / var(--tw-text-opacity, 1));\n}\n.tw-underline {\n text-decoration-line: underline;\n}\n.tw-opacity-0 {\n opacity: 0;\n}\n.tw-opacity-100 {\n opacity: 1;\n}\n.tw-opacity-50 {\n opacity: 0.5;\n}\n.tw-shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-md {\n --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-drop-shadow-md {\n --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.tw-backdrop-brightness-75 {\n --tw-backdrop-brightness: brightness(.75);\n -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.tw-transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-transition-none {\n transition-property: none;\n}\n.tw-transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-duration-200 {\n transition-duration: 200ms;\n}\n.tw-duration-300 {\n transition-duration: 300ms;\n}\n.tw-duration-500 {\n transition-duration: 500ms;\n}\n.tw-ease-in {\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n}\n.\\[--tab-border-color\\:var\\(--fallback-bc\\2c oklch\\(var\\(--bc\\)\\/0\\.2\\)\\)\\] {\n --tab-border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.\\!\\[clip\\:rect\\(0\\2c 0\\2c 0\\2c 0\\)\\] {\n clip: rect(0,0,0,0) !important;\n}\n.\\[clip\\:rect\\(0\\2c 0\\2c 0\\2c 0\\)\\] {\n clip: rect(0,0,0,0);\n}\n.\\[direction\\:ltr\\] {\n direction: ltr;\n}\n.\\[overflow-anchor\\:none\\] {\n overflow-anchor: none;\n}\n.\\[transition\\:background-color_\\.2s_linear\\2c _height_\\.2s_ease-in-out\\] {\n transition: background-color .2s linear, height .2s ease-in-out;\n}\n.\\[transition\\:background-color_\\.2s_linear\\2c _width_\\.2s_ease-in-out\\2c _opacity\\] {\n transition: background-color .2s linear, width .2s ease-in-out, opacity;\n}\n.\\[transition\\:background-color_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\2c box-shadow_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\2c border_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\] {\n transition: background-color 250ms cubic-bezier(0.4,0,0.2,1) 0ms,box-shadow 250ms cubic-bezier(0.4,0,0.2,1) 0ms,border 250ms cubic-bezier(0.4,0,0.2,1) 0ms;\n}\n\n.fade {\n -webkit-mask-image: linear-gradient(180deg, transparent, #000 1%, #000 99%, transparent);\n mask-image: linear-gradient(180deg, transparent, #000 1%, #000 99%, transparent);\n}\n\n.tw-modal {\n z-index: 1200 !important;\n}\n\n.tw-menu li a {\n border-radius: 10px;\n}\n\n.tw-modal {\n z-index: 1200 !important;\n max-height: 100dvh;\n}\n\n.tw-modal-box {\n max-height: calc(100dvh - 2em);\n}\n\n.Toastify__toast {\n border-radius: 1rem;\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n margin-left: 1rem;\n margin-right: 1rem;\n margin-bottom: 1rem;\n background-color: var(--fallback-b1,oklch(var(--b1)/1));\n color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n\n.Toastify__toast-container {\n z-index: 2001 !important;\n}\n\n.Toastify__toast-container--top-right {\n top: 4.75em !important;\n}\n\n:root {\n\n --toastify-color-info: var(--fallback-in,oklch(var(--in)/1));\n --toastify-color-success: var(--fallback-su,oklch(var(--su)/1));\n --toastify-color-warning: var(--fallback-wa,oklch(var(--wa)/1));\n --toastify-color-error: var(--fallback-er,oklch(var(--er)/1));\n\n}\n\n.placeholder-center::-moz-placeholder {\n text-align: center;\n}\n\n.placeholder-center::placeholder {\n text-align: center;\n}\n\n.custom-file-upload {\n cursor: pointer;\n}\n\ninput[type=\"file\"] {\n display: none;\n}\n\n.custom-file-upload:hover .button {\n opacity: 0.8;\n}\n\n.custom-file-upload .button {\n transition: .5s ease;\n opacity: 0;\n position: absolute;\n transform: translate(8px, 8px);\n\n}\n\n.tw-tab-content .container {\n height: 100%;\n}\n\n.masonry {\n -moz-column-count: 1;\n column-count: 1;\n -moz-column-gap: 1.5rem;\n column-gap: 1.5rem;\n}\n.masonry-item {\n -moz-column-break-inside: avoid;\n break-inside: avoid;\n margin-bottom: 1.5rem;\n}\n@media (min-width: 640px) {\n .masonry {\n -moz-column-count: 2;\n column-count: 2;\n }\n}\n@media (min-width: 1024px) {\n .masonry {\n -moz-column-count: 3;\n column-count: 3;\n }\n}\n@media (min-width: 1536px) {\n .masonry {\n -moz-column-count: 4;\n column-count: 4;\n }\n}\n@media (min-width: 640px) {\n\n .sm\\:tw-table-sm :not(thead):not(tfoot) tr {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .sm\\:tw-table-sm :where(th, td) {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n}\n@media (min-width: 768px) {\n\n .md\\:tw-table-md :not(thead):not(tfoot) tr {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .md\\:tw-table-md :where(th, td) {\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n}\n.hover\\:tw-cursor-pointer:hover {\n cursor: pointer;\n}\n.hover\\:tw-bg-base-200:hover {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity, 1)));\n}\n.hover\\:tw-bg-slate-300:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(203 213 225 / var(--tw-bg-opacity, 1));\n}\n.hover\\:tw-bg-transparent:hover {\n background-color: transparent;\n}\n.hover\\:tw-font-bold:hover {\n font-weight: 700;\n}\n.hover\\:tw-text-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity, 1)));\n}\n.hover\\:tw-underline:hover {\n text-decoration-line: underline;\n}\n.focus\\:tw-border-indigo-500:focus {\n --tw-border-opacity: 1;\n border-color: rgb(99 102 241 / var(--tw-border-opacity, 1));\n}\n.focus\\:tw-outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.focus\\:tw-ring-indigo-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));\n}\n.data-\\[te-sidenav-slim\\=\\'true\\'\\]\\:tw-hidden[data-te-sidenav-slim='true'] {\n display: none;\n}\n.data-\\[te-sidenav-slim-collapsed\\=\\'true\\'\\]\\:tw-w-\\[56px\\][data-te-sidenav-slim-collapsed='true'] {\n width: 56px;\n}\n.data-\\[te-sidenav-slim\\=\\'true\\'\\]\\:tw-w-\\[56px\\][data-te-sidenav-slim='true'] {\n width: 56px;\n}\n.data-\\[te-sidenav-hidden\\=\\'false\\'\\]\\:tw-translate-x-0[data-te-sidenav-hidden='false'] {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-group[data-te-sidenav-slim-collapsed='true'] .group-\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\]\\:data-\\[te-sidenav-slim\\=\\'false\\'\\]\\:tw-hidden[data-te-sidenav-slim='false'] {\n display: none;\n}\n@media (min-width: 640px) {\n\n .sm\\:\\!tw-left-auto {\n left: auto !important;\n }\n\n .sm\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .sm\\:tw-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n}\n@media (min-width: 768px) {\n\n .md\\:tw-mb-0 {\n margin-bottom: 0px;\n }\n\n .md\\:tw-flex {\n display: flex;\n }\n\n .md\\:tw-hidden {\n display: none;\n }\n\n .md\\:tw-w-1\\/2 {\n width: 50%;\n }\n\n .md\\:tw-w-\\[calc\\(50\\%-32px\\)\\] {\n width: calc(50% - 32px);\n }\n\n .md\\:tw-columns-2 {\n -moz-columns: 2;\n columns: 2;\n }\n\n .md\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .md\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .md\\:tw-space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\:tw-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n}\n@media (min-width: 1024px) {\n\n .lg\\:tw-columns-3 {\n -moz-columns: 3;\n columns: 3;\n }\n\n .lg\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n}\n@media (min-width: 1280px) {\n\n .xl\\:tw-max-w-6xl {\n max-width: 72rem;\n }\n\n .xl\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .xl\\:tw-text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n }\n}\n@media (min-width: 1536px) {\n\n .\\32xl\\:tw-columns-4 {\n -moz-columns: 4;\n columns: 4;\n }\n\n .\\32xl\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.rtl\\:\\[direction\\:rtl\\]:where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n direction: rtl;\n}\n@media (prefers-color-scheme: dark) {\n\n .dark\\:tw-bg-zinc-800 {\n --tw-bg-opacity: 1;\n background-color: rgb(39 39 42 / var(--tw-bg-opacity, 1));\n }\n}\n.\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\[data-te-sidenav-slim\\=\\'false\\'\\]\\]\\:tw-hidden[data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='false'] {\n display: none;\n}\n.\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\[data-te-sidenav-slim\\=\\'true\\'\\]\\]\\:\\[display\\:unset\\][data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='true'] {\n display: unset;\n}";
|
|
76
|
+
var css_248z$4 = "*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}/*\n! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: Helvetica, sans-serif, Roboto; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden]:where(:not([hidden=\"until-found\"])) {\n display: none;\n}\n\n:root,\n[data-theme] {\n background-color: var(--fallback-b1,oklch(var(--b1)/1));\n color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n\n@supports not (color: oklch(0% 0 0)) {\n\n :root {\n color-scheme: light;\n --fallback-p: #491eff;\n --fallback-pc: #d4dbff;\n --fallback-s: #ff41c7;\n --fallback-sc: #fff9fc;\n --fallback-a: #00cfbd;\n --fallback-ac: #00100d;\n --fallback-n: #2b3440;\n --fallback-nc: #d7dde4;\n --fallback-b1: #ffffff;\n --fallback-b2: #e5e6e6;\n --fallback-b3: #e5e6e6;\n --fallback-bc: #1f2937;\n --fallback-in: #00b3f0;\n --fallback-inc: #000000;\n --fallback-su: #00ca92;\n --fallback-suc: #000000;\n --fallback-wa: #ffc22d;\n --fallback-wac: #000000;\n --fallback-er: #ff6f70;\n --fallback-erc: #000000;\n }\n\n @media (prefers-color-scheme: dark) {\n\n :root {\n color-scheme: dark;\n --fallback-p: #7582ff;\n --fallback-pc: #050617;\n --fallback-s: #ff71cf;\n --fallback-sc: #190211;\n --fallback-a: #00c7b5;\n --fallback-ac: #000e0c;\n --fallback-n: #2a323c;\n --fallback-nc: #a6adbb;\n --fallback-b1: #1d232a;\n --fallback-b2: #191e24;\n --fallback-b3: #15191e;\n --fallback-bc: #a6adbb;\n --fallback-in: #00b3f0;\n --fallback-inc: #000000;\n --fallback-su: #00ca92;\n --fallback-suc: #000000;\n --fallback-wa: #ffc22d;\n --fallback-wac: #000000;\n --fallback-er: #ff6f70;\n --fallback-erc: #000000;\n }\n }\n}\n\nhtml {\n -webkit-tap-highlight-color: transparent;\n}\n\n* {\n scrollbar-color: color-mix(in oklch, currentColor 35%, transparent) transparent;\n}\n\n*:hover {\n scrollbar-color: color-mix(in oklch, currentColor 60%, transparent) transparent;\n}\n\n:root {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 89.824% 0.06192 275.75;\n --ac: 15.352% 0.0368 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 49.12% 0.3096 275.75;\n --s: 69.71% 0.329 342.55;\n --sc: 98.71% 0.0106 342.55;\n --a: 76.76% 0.184 183.61;\n --n: 32.1785% 0.02476 255.701624;\n --nc: 89.4994% 0.011585 252.096176;\n --b1: 100% 0 0;\n --b2: 96.1151% 0 0;\n --b3: 92.4169% 0.00108 197.137559;\n --bc: 27.8078% 0.029596 256.847952;\n}\n\n@media (prefers-color-scheme: dark) {\n\n :root {\n color-scheme: dark;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 13.138% 0.0392 275.75;\n --sc: 14.96% 0.052 342.55;\n --ac: 14.902% 0.0334 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 65.69% 0.196 275.75;\n --s: 74.8% 0.26 342.55;\n --a: 74.51% 0.167 183.61;\n --n: 31.3815% 0.021108 254.139175;\n --nc: 74.6477% 0.0216 264.435964;\n --b1: 25.3267% 0.015896 252.417568;\n --b2: 23.2607% 0.013807 253.100675;\n --b3: 21.1484% 0.01165 254.087939;\n --bc: 74.6477% 0.0216 264.435964;\n }\n}\n\n[data-theme=light] {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 89.824% 0.06192 275.75;\n --ac: 15.352% 0.0368 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 49.12% 0.3096 275.75;\n --s: 69.71% 0.329 342.55;\n --sc: 98.71% 0.0106 342.55;\n --a: 76.76% 0.184 183.61;\n --n: 32.1785% 0.02476 255.701624;\n --nc: 89.4994% 0.011585 252.096176;\n --b1: 100% 0 0;\n --b2: 96.1151% 0 0;\n --b3: 92.4169% 0.00108 197.137559;\n --bc: 27.8078% 0.029596 256.847952;\n}\n\n[data-theme=dark] {\n color-scheme: dark;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 13.138% 0.0392 275.75;\n --sc: 14.96% 0.052 342.55;\n --ac: 14.902% 0.0334 183.61;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 65.69% 0.196 275.75;\n --s: 74.8% 0.26 342.55;\n --a: 74.51% 0.167 183.61;\n --n: 31.3815% 0.021108 254.139175;\n --nc: 74.6477% 0.0216 264.435964;\n --b1: 25.3267% 0.015896 252.417568;\n --b2: 23.2607% 0.013807 253.100675;\n --b3: 21.1484% 0.01165 254.087939;\n --bc: 74.6477% 0.0216 264.435964;\n}\n\n[data-theme=cupcake] {\n color-scheme: light;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 15.2344% 0.017892 200.026556;\n --sc: 15.787% 0.020249 356.29965;\n --ac: 15.8762% 0.029206 78.618794;\n --nc: 84.7148% 0.013247 313.189598;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --p: 76.172% 0.089459 200.026556;\n --s: 78.9351% 0.101246 356.29965;\n --a: 79.3811% 0.146032 78.618794;\n --n: 23.5742% 0.066235 313.189598;\n --b1: 97.7882% 0.00418 56.375637;\n --b2: 93.9822% 0.007638 61.449292;\n --b3: 91.5861% 0.006811 53.440502;\n --bc: 23.5742% 0.066235 313.189598;\n --rounded-btn: 1.9rem;\n --tab-border: 2px;\n --tab-radius: 0.7rem;\n}\n\n[data-theme=retro] {\n color-scheme: light;\n --inc: 90.923% 0.043042 262.880917;\n --suc: 12.541% 0.033982 149.213788;\n --wac: 13.3168% 0.031484 58.31834;\n --erc: 13.144% 0.0398 27.33;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --p: 76.8664% 0.104092 22.664655;\n --pc: 26.5104% 0.006243 0.522862;\n --s: 80.7415% 0.052534 159.094608;\n --sc: 26.5104% 0.006243 0.522862;\n --a: 70.3919% 0.125455 52.953428;\n --ac: 26.5104% 0.006243 0.522862;\n --n: 28.4181% 0.009519 355.534017;\n --nc: 92.5604% 0.025113 89.217311;\n --b1: 91.6374% 0.034554 90.51575;\n --b2: 88.2722% 0.049418 91.774344;\n --b3: 84.133% 0.065952 90.856665;\n --bc: 26.5104% 0.006243 0.522862;\n --in: 54.615% 0.215208 262.880917;\n --su: 62.7052% 0.169912 149.213788;\n --wa: 66.584% 0.157422 58.31834;\n --er: 65.72% 0.199 27.33;\n --rounded-box: 0.4rem;\n --rounded-btn: 0.4rem;\n --rounded-badge: 0.4rem;\n --tab-radius: 0.4rem;\n}\n\n[data-theme=cyberpunk] {\n color-scheme: light;\n --b2: 87.8943% 0.16647 104.32;\n --b3: 81.2786% 0.15394 104.32;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --bc: 18.902% 0.0358 104.32;\n --pc: 14.844% 0.0418 6.35;\n --sc: 16.666% 0.0368 204.72;\n --ac: 14.372% 0.04352 310.43;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;\n --p: 74.22% 0.209 6.35;\n --s: 83.33% 0.184 204.72;\n --a: 71.86% 0.2176 310.43;\n --n: 23.04% 0.065 269.31;\n --nc: 94.51% 0.179 104.32;\n --b1: 94.51% 0.179 104.32;\n --rounded-box: 0;\n --rounded-btn: 0;\n --rounded-badge: 0;\n --tab-radius: 0;\n}\n\n[data-theme=aqua] {\n color-scheme: dark;\n --b2: 45.3464% 0.118611 261.181672;\n --b3: 41.9333% 0.109683 261.181672;\n --bc: 89.7519% 0.025508 261.181672;\n --sc: 12.1365% 0.02175 309.782946;\n --ac: 18.6854% 0.020445 94.555431;\n --nc: 12.2124% 0.023402 243.760661;\n --inc: 90.923% 0.043042 262.880917;\n --suc: 12.541% 0.033982 149.213788;\n --wac: 13.3168% 0.031484 58.31834;\n --erc: 14.79% 0.038 27.33;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --p: 85.6617% 0.14498 198.6458;\n --pc: 40.1249% 0.068266 197.603872;\n --s: 60.6827% 0.108752 309.782946;\n --a: 93.4269% 0.102225 94.555431;\n --n: 61.0622% 0.117009 243.760661;\n --b1: 48.7596% 0.127539 261.181672;\n --in: 54.615% 0.215208 262.880917;\n --su: 62.7052% 0.169912 149.213788;\n --wa: 66.584% 0.157422 58.31834;\n --er: 73.95% 0.19 27.33;\n}\n\n[data-theme=docutopia] {\n --p: 54.645% 0.29421 298.46034;\n --b2: 25.8897% 0.107132 328.136712;\n --b3: 23.941% 0.099069 328.136712;\n --in: 72.06% 0.191 231.6;\n --su: 64.8% 0.150 160;\n --wa: 84.71% 0.199 83.87;\n --er: 71.76% 0.221 22.18;\n --pc: 90.929% 0.058842 298.46034;\n --sc: 13.9726% 0.031813 159.602475;\n --ac: 91.4207% 0.047244 260.255903;\n --nc: 84.1911% 0.008064 74.211583;\n --inc: 0% 0 0;\n --suc: 0% 0 0;\n --wac: 0% 0 0;\n --erc: 0% 0 0;\n --rounded-box: 1rem;\n --rounded-btn: 0.5rem;\n --rounded-badge: 1.9rem;\n --animation-btn: 0.25s;\n --animation-input: .2s;\n --btn-focus-scale: 0.95;\n --border-btn: 1px;\n --tab-border: 1px;\n --tab-radius: 0.5rem;\n --s: 69.8629% 0.159065 159.602475;\n --a: 57.1034% 0.236222 260.255903;\n --n: 20.9553% 0.040319 74.211583;\n --bc: 81.3966% 0.126754 58.524936;\n --b1: 27.8384% 0.115196 328.136712;\n}\n\ninput[type=\"range\"]::-webkit-slider-thumb {\n height: 1rem;\n width: 1rem;\n border-radius: 9999px;\n border: 0;\n appearance: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n cursor: pointer;\n}\n\n.dark input[type=\"range\"]::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled:focus::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:disabled:active::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled:focus::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:disabled:active::-webkit-slider-thumb {}\n\ninput[type=\"range\"]::-moz-range-thumb {\n height: 1rem;\n width: 1rem;\n border-radius: 9999px;\n border: 0;\n appearance: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n cursor: pointer;\n}\n\n.dark input[type=\"range\"]::-moz-range-thumb {}\n\ninput[type=\"range\"]:disabled::-moz-range-thumb {}\n\n.dark input[type=\"range\"]:disabled::-moz-range-thumb {}\n\ninput[type=\"range\"]::-moz-range-progress {}\n\ninput[type=\"range\"]::-ms-fill-lower {}\n\n.dark input[type=\"range\"]::-moz-range-progress {}\n\n.dark input[type=\"range\"]::-ms-fill-lower {}\n\ninput[type=\"range\"]:focus {\n outline: none;\n}\n\ninput[type=\"range\"]:focus::-webkit-slider-thumb {}\n\ninput[type=\"range\"]:active::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:focus::-webkit-slider-thumb {}\n\n.dark input[type=\"range\"]:active::-webkit-slider-thumb {}\n.tw-alert {\n display: grid;\n width: 100%;\n grid-auto-flow: row;\n align-content: flex-start;\n align-items: center;\n justify-items: center;\n gap: 1rem;\n text-align: center;\n border-radius: var(--rounded-box, 1rem);\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n padding: 1rem;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --alert-bg: var(--fallback-b2,oklch(var(--b2)/1));\n --alert-bg-mix: var(--fallback-b1,oklch(var(--b1)/1));\n background-color: var(--alert-bg);\n}\n@media (min-width: 640px) {\n\n .tw-alert {\n grid-auto-flow: column;\n grid-template-columns: auto minmax(auto,1fr);\n justify-items: start;\n text-align: start;\n }\n}\n.tw-avatar {\n position: relative;\n display: inline-flex;\n}\n.tw-avatar > div {\n display: block;\n aspect-ratio: 1 / 1;\n overflow: hidden;\n}\n.tw-avatar img {\n height: 100%;\n width: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.tw-avatar.tw-placeholder > div {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.tw-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n height: 1.25rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n width: -moz-fit-content;\n width: fit-content;\n padding-left: 0.563rem;\n padding-right: 0.563rem;\n border-radius: var(--rounded-badge, 1.9rem);\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n}\n.tw-breadcrumbs {\n max-width: 100%;\n overflow-x: auto;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.tw-breadcrumbs > ul,\n .tw-breadcrumbs > ol {\n display: flex;\n align-items: center;\n white-space: nowrap;\n min-height: -moz-min-content;\n min-height: min-content;\n}\n.tw-breadcrumbs > ul > li, .tw-breadcrumbs > ol > li {\n display: flex;\n align-items: center;\n}\n.tw-breadcrumbs > ul > li > a, .tw-breadcrumbs > ol > li > a {\n display: flex;\n cursor: pointer;\n align-items: center;\n}\n@media (hover:hover) {\n\n .tw-breadcrumbs > ul > li > a:hover, .tw-breadcrumbs > ol > li > a:hover {\n text-decoration-line: underline;\n }\n\n .tw-checkbox-success:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n }\n\n .tw-label a:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n }\n\n .tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn):active,\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn).tw-active,\n.tw-menu li > details > summary:active {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n }\n\n .tw-tab:hover {\n --tw-text-opacity: 1;\n }\n\n .tw-table tr.tw-hover:hover,\n .tw-table tr.tw-hover:nth-child(even):hover {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n }\n}\n.tw-btn {\n display: inline-flex;\n height: 3rem;\n min-height: 3rem;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n border-radius: var(--rounded-btn, 0.5rem);\n border-color: transparent;\n border-color: oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity));\n padding-left: 1rem;\n padding-right: 1rem;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1em;\n gap: 0.5rem;\n font-weight: 600;\n text-decoration-line: none;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n border-width: var(--border-btn, 1px);\n transition-property: color, background-color, border-color, opacity, box-shadow, transform;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: var(--fallback-bc,oklch(var(--bc)/1));\n background-color: oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity));\n --tw-bg-opacity: 1;\n --tw-border-opacity: 1;\n}\n.tw-btn-disabled,\n .tw-btn[disabled],\n .tw-btn:disabled {\n pointer-events: none;\n}\n.tw-btn-square {\n height: 3rem;\n width: 3rem;\n padding: 0px;\n}\n.tw-btn-circle {\n height: 3rem;\n width: 3rem;\n border-radius: 9999px;\n padding: 0px;\n}\n:where(.tw-btn:is(input[type=\"checkbox\"])),\n:where(.tw-btn:is(input[type=\"radio\"])) {\n width: auto;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\n.tw-btn:is(input[type=\"checkbox\"]):after,\n.tw-btn:is(input[type=\"radio\"]):after {\n --tw-content: attr(aria-label);\n content: var(--tw-content);\n}\n.tw-card {\n position: relative;\n display: flex;\n flex-direction: column;\n border-radius: var(--rounded-box, 1rem);\n}\n.tw-card:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-card-body {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n padding: var(--padding-card, 2rem);\n gap: 0.5rem;\n}\n.tw-card-body :where(p) {\n flex-grow: 1;\n}\n.tw-card-actions {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 0.5rem;\n}\n.tw-card figure {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.tw-card.tw-image-full {\n display: grid;\n}\n.tw-card.tw-image-full:before {\n position: relative;\n content: \"\";\n z-index: 10;\n border-radius: var(--rounded-box, 1rem);\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n opacity: 0.75;\n}\n.tw-card.tw-image-full:before,\n .tw-card.tw-image-full > * {\n grid-column-start: 1;\n grid-row-start: 1;\n}\n.tw-card.tw-image-full > figure img {\n height: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.tw-card.tw-image-full > .tw-card-body {\n position: relative;\n z-index: 20;\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n}\n.tw-checkbox {\n flex-shrink: 0;\n --chkbg: var(--fallback-bc,oklch(var(--bc)/1));\n --chkfg: var(--fallback-b1,oklch(var(--b1)/1));\n height: 1.5rem;\n width: 1.5rem;\n cursor: pointer;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0.2;\n}\n.tw-divider {\n display: flex;\n flex-direction: row;\n align-items: center;\n align-self: stretch;\n margin-top: 1rem;\n margin-bottom: 1rem;\n height: 1rem;\n white-space: nowrap;\n}\n.tw-divider:before,\n .tw-divider:after {\n height: 0.125rem;\n width: 100%;\n flex-grow: 1;\n --tw-content: '';\n content: var(--tw-content);\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n}\n.tw-dropdown {\n position: relative;\n display: inline-block;\n}\n.tw-dropdown > *:not(summary):focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-dropdown .tw-dropdown-content {\n position: absolute;\n}\n.tw-dropdown:is(:not(details)) .tw-dropdown-content {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n visibility: hidden;\n opacity: 0;\n transform-origin: top;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n}\n.tw-dropdown-end .tw-dropdown-content {\n inset-inline-end: 0px;\n}\n.tw-dropdown-left .tw-dropdown-content {\n bottom: auto;\n inset-inline-end: 100%;\n top: 0px;\n transform-origin: right;\n}\n.tw-dropdown-right .tw-dropdown-content {\n bottom: auto;\n inset-inline-start: 100%;\n top: 0px;\n transform-origin: left;\n}\n.tw-dropdown-bottom .tw-dropdown-content {\n bottom: auto;\n top: 100%;\n transform-origin: top;\n}\n.tw-dropdown-top .tw-dropdown-content {\n bottom: 100%;\n top: auto;\n transform-origin: bottom;\n}\n.tw-dropdown-end.tw-dropdown-right .tw-dropdown-content {\n bottom: 0px;\n top: auto;\n}\n.tw-dropdown-end.tw-dropdown-left .tw-dropdown-content {\n bottom: 0px;\n top: auto;\n}\n.tw-dropdown.tw-dropdown-open .tw-dropdown-content,\n.tw-dropdown:not(.tw-dropdown-hover):focus .tw-dropdown-content,\n.tw-dropdown:focus-within .tw-dropdown-content {\n visibility: visible;\n opacity: 1;\n}\n@media (hover: hover) {\n\n .tw-dropdown.tw-dropdown-hover:hover .tw-dropdown-content {\n visibility: visible;\n opacity: 1;\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn:hover {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:hover {\n background-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,\n black\n );\n border-color: color-mix(\n in oklab,\n oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,\n black\n );\n }\n }\n\n @supports not (color: oklch(0% 0 0)) {\n\n .tw-btn:hover {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n }\n\n .tw-btn.tw-glass:hover {\n --glass-opacity: 25%;\n --glass-border-opacity: 15%;\n }\n\n .tw-btn-ghost:hover {\n border-color: transparent;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n .tw-btn-ghost:hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n }\n }\n\n .tw-btn-ghost:hover {\n border-color: transparent;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n .tw-btn-ghost:hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n }\n }\n\n .tw-btn-outline.tw-btn-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary:hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary:hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-error:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-error:hover {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n }\n\n .tw-btn-outline.tw-btn-error:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-error:hover {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n }\n\n .tw-btn-disabled:hover,\n .tw-btn[disabled]:hover,\n .tw-btn:disabled:hover {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n }\n\n @supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn:is(input[type=\"checkbox\"]:checked):hover, .tw-btn:is(input[type=\"radio\"]:checked):hover {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n }\n\n .tw-dropdown.tw-dropdown-hover:hover .tw-dropdown-content {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n cursor: pointer;\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n @supports (color: oklch(0% 0 0)) {\n\n :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(.tw-active, .tw-btn):hover, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(.tw-active, .tw-btn):hover {\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n }\n }\n\n .tw-tab[disabled],\n .tw-tab[disabled]:hover {\n cursor: not-allowed;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n }\n}\n.tw-dropdown:is(details) summary::-webkit-details-marker {\n display: none;\n}\n.tw-file-input {\n height: 3rem;\n flex-shrink: 1;\n padding-inline-end: 1rem;\n font-size: 1rem;\n line-height: 2;\n line-height: 1.5rem;\n overflow: hidden;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-file-input::file-selector-button {\n margin-inline-end: 1rem;\n display: inline-flex;\n height: 100%;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n padding-left: 1rem;\n padding-right: 1rem;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 1em;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n border-style: solid;\n --tw-border-opacity: 1;\n border-color: var(--fallback-n,oklch(var(--n)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n font-weight: 600;\n text-transform: uppercase;\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n text-decoration-line: none;\n border-width: var(--border-btn, 1px);\n animation: button-pop var(--animation-btn, 0.25s) ease-out;\n}\n.tw-form-control {\n display: flex;\n flex-direction: column;\n}\n.tw-label {\n display: flex;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n align-items: center;\n justify-content: space-between;\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.tw-indicator {\n position: relative;\n display: inline-flex;\n width: -moz-max-content;\n width: max-content;\n}\n.tw-indicator :where(.tw-indicator-item) {\n z-index: 1;\n position: absolute;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n white-space: nowrap;\n}\n.tw-input {\n flex-shrink: 1;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n height: 3rem;\n padding-left: 1rem;\n padding-right: 1rem;\n font-size: 1rem;\n line-height: 2;\n line-height: 1.5rem;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-input[type=\"number\"]::-webkit-inner-spin-button,\n.tw-input-md[type=\"number\"]::-webkit-inner-spin-button {\n margin-top: -1rem;\n margin-bottom: -1rem;\n margin-inline-end: -1rem;\n}\n.tw-input-sm[type=\"number\"]::-webkit-inner-spin-button {\n margin-top: 0px;\n margin-bottom: 0px;\n margin-inline-end: -0px;\n}\n.tw-join .tw-dropdown .tw-join-item:first-child:not(:last-child),\n .tw-join *:first-child:not(:last-child) .tw-dropdown .tw-join-item {\n border-start-end-radius: inherit;\n border-end-end-radius: inherit;\n}\n.tw-mask {\n -webkit-mask-size: contain;\n mask-size: contain;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-position: center;\n mask-position: center;\n}\n.tw-menu {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n font-size: 0.875rem;\n line-height: 1.25rem;\n padding: 0.5rem;\n}\n.tw-menu :where(li ul) {\n position: relative;\n white-space: nowrap;\n margin-inline-start: 1rem;\n padding-inline-start: 0.5rem;\n}\n.tw-menu :where(li:not(.tw-menu-title) > *:not(ul, details, .tw-menu-title, .tw-btn)), .tw-menu :where(li:not(.tw-menu-title) > details > summary:not(.tw-menu-title)) {\n display: grid;\n grid-auto-flow: column;\n align-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n grid-auto-columns: minmax(auto, max-content) auto max-content;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.tw-menu li.tw-disabled {\n cursor: not-allowed;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n color: var(--fallback-bc,oklch(var(--bc)/0.3));\n}\n.tw-menu :where(li > .tw-menu-dropdown:not(.tw-menu-dropdown-show)) {\n display: none;\n}\n:where(.tw-menu li) {\n position: relative;\n display: flex;\n flex-shrink: 0;\n flex-direction: column;\n flex-wrap: wrap;\n align-items: stretch;\n}\n:where(.tw-menu li) .tw-badge {\n justify-self: end;\n}\n.tw-modal {\n pointer-events: none;\n position: fixed;\n inset: 0px;\n margin: 0px;\n display: grid;\n height: 100%;\n max-height: none;\n width: 100%;\n max-width: none;\n justify-items: center;\n padding: 0px;\n opacity: 0;\n overscroll-behavior: contain;\n z-index: 999;\n background-color: transparent;\n color: inherit;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-property: transform, opacity, visibility;\n overflow-y: hidden;\n}\n:where(.tw-modal) {\n align-items: center;\n}\n.tw-modal-box {\n max-height: calc(100vh - 5em);\n grid-column-start: 1;\n grid-row-start: 1;\n width: 91.666667%;\n max-width: 32rem;\n --tw-scale-x: .9;\n --tw-scale-y: .9;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n padding: 1.5rem;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;\n overflow-y: auto;\n overscroll-behavior: contain;\n}\n.tw-modal-open,\n.tw-modal:target,\n.tw-modal-toggle:checked + .tw-modal,\n.tw-modal[open] {\n pointer-events: auto;\n visibility: visible;\n opacity: 1;\n}\n:root:has(:is(.tw-modal-open, .tw-modal:target, .tw-modal-toggle:checked + .tw-modal, .tw-modal[open])) {\n overflow: hidden;\n scrollbar-gutter: stable;\n}\n.tw-navbar {\n display: flex;\n align-items: center;\n padding: var(--navbar-padding, 0.5rem);\n min-height: 4rem;\n width: 100%;\n}\n:where(.tw-navbar > *:not(script, style)) {\n display: inline-flex;\n align-items: center;\n}\n.tw-select {\n display: inline-flex;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n height: 3rem;\n min-height: 3rem;\n padding-inline-start: 1rem;\n padding-inline-end: 2.5rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),\n linear-gradient(135deg, currentColor 50%, transparent 50%);\n background-position: calc(100% - 20px) calc(1px + 50%),\n calc(100% - 16.1px) calc(1px + 50%);\n background-size: 4px 4px,\n 4px 4px;\n background-repeat: no-repeat;\n}\n.tw-select[multiple] {\n height: auto;\n}\n.tw-tabs {\n display: grid;\n align-items: flex-end;\n}\n.tw-tabs-lifted:has(.tw-tab-content[class^=\"rounded-\"])\n .tw-tab:first-child:not(:is(.tw-tab-active, [aria-selected=\"true\"])), .tw-tabs-lifted:has(.tw-tab-content[class*=\" rounded-\"])\n .tw-tab:first-child:not(:is(.tw-tab-active, [aria-selected=\"true\"])) {\n border-bottom-color: transparent;\n}\n.tw-tab {\n position: relative;\n grid-row-start: 1;\n display: inline-flex;\n height: 2rem;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n --tab-padding: 1rem;\n --tw-text-opacity: 0.5;\n --tab-color: var(--fallback-bc,oklch(var(--bc)/1));\n --tab-bg: var(--fallback-b1,oklch(var(--b1)/1));\n --tab-border-color: var(--fallback-b3,oklch(var(--b3)/1));\n color: var(--tab-color);\n padding-inline-start: var(--tab-padding, 1rem);\n padding-inline-end: var(--tab-padding, 1rem);\n}\n.tw-tab:is(input[type=\"radio\"]) {\n width: auto;\n border-bottom-right-radius: 0px;\n border-bottom-left-radius: 0px;\n}\n.tw-tab:is(input[type=\"radio\"]):after {\n --tw-content: attr(aria-label);\n content: var(--tw-content);\n}\n.tw-tab:not(input):empty {\n cursor: default;\n grid-column-start: span 9999;\n}\n.tw-tab-content {\n grid-column-start: 1;\n grid-column-end: span 9999;\n grid-row-start: 2;\n margin-top: calc(var(--tab-border) * -1);\n display: none;\n border-color: transparent;\n border-width: var(--tab-border, 0);\n}\n:checked + .tw-tab-content:nth-child(2),\n :is(.tw-tab-active, [aria-selected=\"true\"]) + .tw-tab-content:nth-child(2) {\n border-start-start-radius: 0px;\n}\ninput.tw-tab:checked + .tw-tab-content,\n:is(.tw-tab-active, [aria-selected=\"true\"]) + .tw-tab-content {\n display: block;\n}\n.tw-table {\n position: relative;\n width: 100%;\n border-radius: var(--rounded-box, 1rem);\n text-align: left;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-table :where(.tw-table-pin-rows thead tr) {\n position: sticky;\n top: 0px;\n z-index: 1;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-table :where(.tw-table-pin-rows tfoot tr) {\n position: sticky;\n bottom: 0px;\n z-index: 1;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-table :where(.tw-table-pin-cols tr th) {\n position: sticky;\n left: 0px;\n right: 0px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-textarea {\n min-height: 3rem;\n flex-shrink: 1;\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n border-radius: var(--rounded-btn, 0.5rem);\n border-width: 1px;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));\n}\n.tw-avatar-group :where(.tw-avatar) {\n overflow: hidden;\n border-radius: 9999px;\n border-width: 4px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-border-opacity)));\n}\n.tw-badge-success {\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-suc,oklch(var(--suc)/var(--tw-text-opacity)));\n}\n.tw-badge-outline.tw-badge-success {\n --tw-text-opacity: 1;\n color: var(--fallback-su,oklch(var(--su)/var(--tw-text-opacity)));\n}\n.tw-btm-nav > * .tw-label {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-breadcrumbs > ul > li > a:focus, .tw-breadcrumbs > ol > li > a:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-breadcrumbs > ul > li > a:focus-visible, .tw-breadcrumbs > ol > li > a:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n}\n.tw-breadcrumbs > ul > li + *:before, .tw-breadcrumbs > ol > li + *:before {\n content: \"\";\n margin-left: 0.5rem;\n margin-right: 0.75rem;\n display: block;\n height: 0.375rem;\n width: 0.375rem;\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0.4;\n border-top: 1px solid;\n border-right: 1px solid;\n background-color: transparent;\n}\n[dir=\"rtl\"] .tw-breadcrumbs > ul > li + *:before,\n[dir=\"rtl\"] .tw-breadcrumbs > ol > li + *:before {\n --tw-rotate: -135deg;\n}\n@media (prefers-reduced-motion: no-preference) {\n\n .tw-btn {\n animation: button-pop var(--animation-btn, 0.25s) ease-out;\n }\n}\n.tw-btn:active:hover,\n .tw-btn:active:focus {\n animation: button-pop 0s ease-out;\n transform: scale(var(--btn-focus-scale, 0.97));\n}\n@supports not (color: oklch(0% 0 0)) {\n\n .tw-btn {\n background-color: var(--btn-color, var(--fallback-b2));\n border-color: var(--btn-color, var(--fallback-b2));\n }\n\n .tw-btn-primary {\n --btn-color: var(--fallback-p);\n }\n\n .tw-btn-neutral {\n --btn-color: var(--fallback-n);\n }\n\n .tw-btn-error {\n --btn-color: var(--fallback-er);\n }\n}\n@supports (color: color-mix(in oklab, black, black)) {\n\n .tw-btn-outline.tw-btn-primary.tw-btn-active {\n background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);\n }\n\n .tw-btn-outline.tw-btn-error.tw-btn-active {\n background-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n border-color: color-mix(in oklab, var(--fallback-er,oklch(var(--er)/1)) 90%, black);\n }\n}\n.tw-btn:focus-visible {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n}\n.tw-btn-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-p,oklch(var(--p)/1));\n}\n@supports (color: oklch(0% 0 0)) {\n\n .tw-btn-primary {\n --btn-color: var(--p);\n }\n\n .tw-btn-neutral {\n --btn-color: var(--n);\n }\n\n .tw-btn-error {\n --btn-color: var(--er);\n }\n}\n.tw-btn-neutral {\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-n,oklch(var(--n)/1));\n}\n.tw-btn-error {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n outline-color: var(--fallback-er,oklch(var(--er)/1));\n}\n.tw-btn.tw-glass {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: currentColor;\n}\n.tw-btn.tw-glass.tw-btn-active {\n --glass-opacity: 25%;\n --glass-border-opacity: 15%;\n}\n.tw-btn-ghost {\n border-width: 1px;\n border-color: transparent;\n background-color: transparent;\n color: currentColor;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n outline-color: currentColor;\n}\n.tw-btn-ghost.tw-btn-active {\n border-color: transparent;\n background-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-btn-outline.tw-btn-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-primary.tw-btn-active {\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-error {\n --tw-text-opacity: 1;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity)));\n}\n.tw-btn-outline.tw-btn-error.tw-btn-active {\n --tw-text-opacity: 1;\n color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));\n}\n.tw-btn.tw-btn-disabled,\n .tw-btn[disabled],\n .tw-btn:disabled {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-btn:is(input[type=\"checkbox\"]:checked),\n.tw-btn:is(input[type=\"radio\"]:checked) {\n --tw-border-opacity: 1;\n border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));\n}\n.tw-btn:is(input[type=\"checkbox\"]:checked):focus-visible, .tw-btn:is(input[type=\"radio\"]:checked):focus-visible {\n outline-color: var(--fallback-p,oklch(var(--p)/1));\n}\n@keyframes button-pop {\n\n 0% {\n transform: scale(var(--btn-focus-scale, 0.98));\n }\n\n 40% {\n transform: scale(1.02);\n }\n\n 100% {\n transform: scale(1);\n }\n}\n.tw-card :where(figure:first-child) {\n overflow: hidden;\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n border-end-start-radius: unset;\n border-end-end-radius: unset;\n}\n.tw-card :where(figure:last-child) {\n overflow: hidden;\n border-start-start-radius: unset;\n border-start-end-radius: unset;\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n}\n.tw-card:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n}\n.tw-card.tw-bordered {\n border-width: 1px;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-card.tw-compact .tw-card-body {\n padding: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-card-title {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n}\n.tw-card.tw-image-full :where(figure) {\n overflow: hidden;\n border-radius: inherit;\n}\n.tw-checkbox:focus {\n box-shadow: none;\n}\n.tw-checkbox:focus-visible {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n.tw-checkbox:disabled {\n border-width: 0px;\n cursor: not-allowed;\n border-color: transparent;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.2;\n}\n.tw-checkbox:checked,\n .tw-checkbox[aria-checked=\"true\"] {\n background-repeat: no-repeat;\n animation: checkmark var(--animation-input, 0.2s) ease-out;\n background-color: var(--chkbg);\n background-image: linear-gradient(-45deg, transparent 65%, var(--chkbg) 65.99%),\n linear-gradient(45deg, transparent 75%, var(--chkbg) 75.99%),\n linear-gradient(-45deg, var(--chkbg) 40%, transparent 40.99%),\n linear-gradient(\n 45deg,\n var(--chkbg) 30%,\n var(--chkfg) 30.99%,\n var(--chkfg) 40%,\n transparent 40.99%\n ),\n linear-gradient(-45deg, var(--chkfg) 50%, var(--chkbg) 50.99%);\n}\n.tw-checkbox:indeterminate {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n background-repeat: no-repeat;\n animation: checkmark var(--animation-input, 0.2s) ease-out;\n background-image: linear-gradient(90deg, transparent 80%, var(--chkbg) 80%),\n linear-gradient(-90deg, transparent 80%, var(--chkbg) 80%),\n linear-gradient(0deg, var(--chkbg) 43%, var(--chkfg) 43%, var(--chkfg) 57%, var(--chkbg) 57%);\n}\n.tw-checkbox-success {\n --chkbg: var(--fallback-su,oklch(var(--su)/1));\n --chkfg: var(--fallback-suc,oklch(var(--suc)/1));\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n}\n.tw-checkbox-success:focus-visible {\n outline-color: var(--fallback-su,oklch(var(--su)/1));\n}\n.tw-checkbox-success:checked,\n .tw-checkbox-success[aria-checked=\"true\"] {\n --tw-border-opacity: 1;\n border-color: var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-suc,oklch(var(--suc)/var(--tw-text-opacity)));\n}\n@keyframes checkmark {\n\n 0% {\n background-position-y: 5px;\n }\n\n 50% {\n background-position-y: -2px;\n }\n\n 100% {\n background-position-y: 0;\n }\n}\n.tw-divider:not(:empty) {\n gap: 1rem;\n}\n.tw-dropdown.tw-dropdown-open .tw-dropdown-content,\n.tw-dropdown:focus .tw-dropdown-content,\n.tw-dropdown:focus-within .tw-dropdown-content {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-file-input:focus {\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-file-input-disabled,\n .tw-file-input[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-file-input-disabled::-moz-placeholder, .tw-file-input[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-file-input-disabled::placeholder,\n .tw-file-input[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-file-input-disabled::file-selector-button, .tw-file-input[disabled]::file-selector-button {\n --tw-border-opacity: 0;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-bg-opacity: 0.2;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-label-text {\n font-size: 0.875rem;\n line-height: 1.25rem;\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n}\n.tw-input input {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));\n background-color: transparent;\n}\n.tw-input input:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-input[list]::-webkit-calendar-picker-indicator {\n line-height: 1em;\n}\n.tw-input-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-input:focus,\n .tw-input:focus-within {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-input:has(> input[disabled]),\n .tw-input-disabled,\n .tw-input:disabled,\n .tw-input[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-input:has(> input[disabled])::-moz-placeholder, .tw-input-disabled::-moz-placeholder, .tw-input:disabled::-moz-placeholder, .tw-input[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-input:has(> input[disabled])::placeholder,\n .tw-input-disabled::placeholder,\n .tw-input:disabled::placeholder,\n .tw-input[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-input:has(> input[disabled]) > input[disabled] {\n cursor: not-allowed;\n}\n.tw-input::-webkit-date-and-time-value {\n text-align: inherit;\n}\n.tw-join > :where(*:not(:first-child)):is(.tw-btn) {\n margin-inline-start: calc(var(--border-btn) * -1);\n}\n.tw-loading {\n pointer-events: none;\n display: inline-block;\n aspect-ratio: 1 / 1;\n width: 1.5rem;\n background-color: currentColor;\n -webkit-mask-size: 100%;\n mask-size: 100%;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-position: center;\n mask-position: center;\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n}\n.tw-loading-spinner {\n -webkit-mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n mask-image: url(\"data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E\");\n}\n.tw-loading-sm {\n width: 1.25rem;\n}\n.tw-loading-md {\n width: 1.5rem;\n}\n.tw-mask-squircle {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e\");\n}\n.tw-mask-decagon {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='192' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z' fill-rule='evenodd'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='192' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z' fill-rule='evenodd'/%3e%3c/svg%3e\");\n}\n.tw-mask-hexagon-2 {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='182' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z' fill='black' fill-rule='nonzero'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='182' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z' fill='black' fill-rule='nonzero'/%3e%3c/svg%3e\");\n}\n.tw-mask-circle {\n -webkit-mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle fill='black' cx='100' cy='100' r='100' fill-rule='evenodd'/%3e%3c/svg%3e\");\n mask-image: url(\"data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle fill='black' cx='100' cy='100' r='100' fill-rule='evenodd'/%3e%3c/svg%3e\");\n}\n:where(.tw-menu li:empty) {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.1;\n margin: 0.5rem 1rem;\n height: 1px;\n}\n.tw-menu :where(li ul):before {\n position: absolute;\n bottom: 0.75rem;\n inset-inline-start: 0px;\n top: 0.75rem;\n width: 1px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));\n opacity: 0.1;\n content: \"\";\n}\n.tw-menu :where(li:not(.tw-menu-title) > *:not(ul, details, .tw-menu-title, .tw-btn)),\n.tw-menu :where(li:not(.tw-menu-title) > details > summary:not(.tw-menu-title)) {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n border-radius: var(--rounded-btn, 0.5rem);\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n text-align: start;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n transition-duration: 200ms;\n text-wrap: balance;\n}\n:where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(summary, .tw-active, .tw-btn).tw-focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):not(summary, .tw-active, .tw-btn):focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > *:not(ul, details, .tw-menu-title)):is(summary):not(.tw-active, .tw-btn):focus-visible, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(summary, .tw-active, .tw-btn).tw-focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):not(summary, .tw-active, .tw-btn):focus, :where(.tw-menu li:not(.tw-menu-title, .tw-disabled) > details > summary:not(.tw-menu-title)):is(summary):not(.tw-active, .tw-btn):focus-visible {\n cursor: pointer;\n background-color: var(--fallback-bc,oklch(var(--bc)/0.1));\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn):active,\n.tw-menu li > *:not(ul, .tw-menu-title, details, .tw-btn).tw-active,\n.tw-menu li > details > summary:active {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));\n --tw-text-opacity: 1;\n color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));\n}\n.tw-menu :where(li > details > summary)::-webkit-details-marker {\n display: none;\n}\n.tw-menu :where(li > details > summary):after,\n.tw-menu :where(li > .tw-menu-dropdown-toggle):after {\n justify-self: end;\n display: block;\n margin-top: -0.5rem;\n height: 0.5rem;\n width: 0.5rem;\n transform: rotate(45deg);\n transition-property: transform, margin-top;\n transition-duration: 0.3s;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n content: \"\";\n transform-origin: 75% 75%;\n box-shadow: 2px 2px;\n pointer-events: none;\n}\n.tw-menu :where(li > details[open] > summary):after,\n.tw-menu :where(li > .tw-menu-dropdown-toggle.tw-menu-dropdown-show):after {\n transform: rotate(225deg);\n margin-top: 0;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input {\n position: relative;\n margin-left: auto;\n margin-right: auto;\n display: block;\n height: 1.75rem;\n width: 24rem;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n padding-left: 2rem;\n direction: ltr;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input:before {\n content: \"\";\n position: absolute;\n left: 0.5rem;\n top: 50%;\n aspect-ratio: 1 / 1;\n height: 0.75rem;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-radius: 9999px;\n border-width: 2px;\n border-color: currentColor;\n opacity: 0.6;\n}\n.tw-mockup-browser .tw-mockup-browser-toolbar .tw-input:after {\n content: \"\";\n position: absolute;\n left: 1.25rem;\n top: 50%;\n height: 0.5rem;\n --tw-translate-y: 25%;\n --tw-rotate: -45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-radius: 9999px;\n border-width: 1px;\n border-color: currentColor;\n opacity: 0.6;\n}\n.tw-modal:not(dialog:not(.tw-modal-open)),\n .tw-modal::backdrop {\n background-color: #0006;\n animation: modal-pop 0.2s ease-out;\n}\n.tw-modal-backdrop {\n z-index: -1;\n grid-column-start: 1;\n grid-row-start: 1;\n display: grid;\n align-self: stretch;\n justify-self: stretch;\n color: transparent;\n}\n.tw-modal-open .tw-modal-box,\n.tw-modal-toggle:checked + .tw-modal .tw-modal-box,\n.tw-modal:target .tw-modal-box,\n.tw-modal[open] .tw-modal-box {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes modal-pop {\n\n 0% {\n opacity: 0;\n }\n}\n@keyframes progress-loading {\n\n 50% {\n background-position-x: -115%;\n }\n}\n@keyframes radiomark {\n\n 0% {\n box-shadow: 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n\n 50% {\n box-shadow: 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n\n 100% {\n box-shadow: 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset,\n 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset;\n }\n}\n@keyframes rating-pop {\n\n 0% {\n transform: translateY(-0.125em);\n }\n\n 40% {\n transform: translateY(-0.125em);\n }\n\n 100% {\n transform: translateY(0);\n }\n}\n.tw-select-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-select:focus {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-select-disabled,\n .tw-select:disabled,\n .tw-select[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-select-disabled::-moz-placeholder, .tw-select:disabled::-moz-placeholder, .tw-select[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-select-disabled::placeholder,\n .tw-select:disabled::placeholder,\n .tw-select[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-select-multiple,\n .tw-select[multiple],\n .tw-select[size].tw-select:not([size=\"1\"]) {\n background-image: none;\n padding-right: 1rem;\n}\n[dir=\"rtl\"] .tw-select {\n background-position: calc(0% + 12px) calc(1px + 50%),\n calc(0% + 16px) calc(1px + 50%);\n}\n@keyframes skeleton {\n\n from {\n background-position: 150%;\n }\n\n to {\n background-position: -50%;\n }\n}\n.tw-tabs-lifted > .tw-tab:focus-visible {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n}\n.tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]), .tw-tab:is(input:checked) {\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 1;\n --tw-text-opacity: 1;\n}\n.tw-tab:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.tw-tab:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: -5px;\n}\n.tw-tab-disabled,\n .tw-tab[disabled] {\n cursor: not-allowed;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));\n --tw-text-opacity: 0.2;\n}\n.tw-tabs-bordered > .tw-tab {\n border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity)));\n --tw-border-opacity: 0.2;\n border-style: solid;\n border-bottom-width: calc(var(--tab-border, 1px) + 1px);\n}\n.tw-tabs-lifted > .tw-tab {\n border: var(--tab-border, 1px) solid transparent;\n border-width: 0 0 var(--tab-border, 1px) 0;\n border-start-start-radius: var(--tab-radius, 0.5rem);\n border-start-end-radius: var(--tab-radius, 0.5rem);\n border-bottom-color: var(--tab-border-color);\n padding-inline-start: var(--tab-padding, 1rem);\n padding-inline-end: var(--tab-padding, 1rem);\n padding-top: var(--tab-border, 1px);\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]), .tw-tabs-lifted > .tw-tab:is(input:checked) {\n background-color: var(--tab-bg);\n border-width: var(--tab-border, 1px) var(--tab-border, 1px) 0 var(--tab-border, 1px);\n border-inline-start-color: var(--tab-border-color);\n border-inline-end-color: var(--tab-border-color);\n border-top-color: var(--tab-border-color);\n padding-inline-start: calc(var(--tab-padding, 1rem) - var(--tab-border, 1px));\n padding-inline-end: calc(var(--tab-padding, 1rem) - var(--tab-border, 1px));\n padding-bottom: var(--tab-border, 1px);\n padding-top: 0;\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):before, .tw-tabs-lifted > .tw-tab:is(input:checked):before {\n z-index: 1;\n content: \"\";\n display: block;\n position: absolute;\n width: calc(100% + var(--tab-radius, 0.5rem) * 2);\n height: var(--tab-radius, 0.5rem);\n bottom: 0;\n background-size: var(--tab-radius, 0.5rem);\n background-position: top left,\n top right;\n background-repeat: no-repeat;\n --tab-grad: calc(69% - var(--tab-border, 1px));\n --radius-start: radial-gradient(\n circle at top left,\n transparent var(--tab-grad),\n var(--tab-border-color) calc(var(--tab-grad) + 0.25px),\n var(--tab-border-color) calc(var(--tab-grad) + var(--tab-border, 1px)),\n var(--tab-bg) calc(var(--tab-grad) + var(--tab-border, 1px) + 0.25px)\n );\n --radius-end: radial-gradient(\n circle at top right,\n transparent var(--tab-grad),\n var(--tab-border-color) calc(var(--tab-grad) + 0.25px),\n var(--tab-border-color) calc(var(--tab-grad) + var(--tab-border, 1px)),\n var(--tab-bg) calc(var(--tab-grad) + var(--tab-border, 1px) + 0.25px)\n );\n background-image: var(--radius-start), var(--radius-end);\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):first-child:before, .tw-tabs-lifted > .tw-tab:is(input:checked):first-child:before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n[dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):first-child:before, [dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(input:checked):first-child:before {\n background-image: var(--radius-start);\n background-position: top left;\n}\n.tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):last-child:before, .tw-tabs-lifted > .tw-tab:is(input:checked):last-child:before {\n background-image: var(--radius-start);\n background-position: top left;\n}\n[dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):last-child:before, [dir=\"rtl\"] .tw-tabs-lifted > .tw-tab:is(input:checked):last-child:before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n.tw-tabs-lifted\n > :is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled])\n + .tw-tabs-lifted\n :is(.tw-tab-active, [aria-selected=\"true\"]):not(.tw-tab-disabled):not([disabled]):before, .tw-tabs-lifted > .tw-tab:is(input:checked) + .tw-tabs-lifted .tw-tab:is(input:checked):before {\n background-image: var(--radius-end);\n background-position: top right;\n}\n.tw-tabs-boxed .tw-tab {\n border-radius: var(--rounded-btn, 0.5rem);\n}\n.tw-table:where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n text-align: right;\n}\n.tw-table :where(th, td) {\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n vertical-align: middle;\n}\n.tw-table tr.tw-active,\n .tw-table tr.tw-active:nth-child(even),\n .tw-table-zebra tbody tr:nth-child(even) {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n}\n.tw-table :where(thead tr, tbody tr:not(:last-child), tbody tr:first-child:last-child) {\n border-bottom-width: 1px;\n --tw-border-opacity: 1;\n border-bottom-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-table :where(thead, tfoot) {\n white-space: nowrap;\n font-size: 0.75rem;\n line-height: 1rem;\n font-weight: 700;\n color: var(--fallback-bc,oklch(var(--bc)/0.6));\n}\n.tw-table :where(tfoot) {\n border-top-width: 1px;\n --tw-border-opacity: 1;\n border-top-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n}\n.tw-textarea-bordered {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-textarea:focus {\n box-shadow: none;\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-textarea-disabled,\n .tw-textarea:disabled,\n .tw-textarea[disabled] {\n cursor: not-allowed;\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));\n color: var(--fallback-bc,oklch(var(--bc)/0.4));\n}\n.tw-textarea-disabled::-moz-placeholder, .tw-textarea:disabled::-moz-placeholder, .tw-textarea[disabled]::-moz-placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n.tw-textarea-disabled::placeholder,\n .tw-textarea:disabled::placeholder,\n .tw-textarea[disabled]::placeholder {\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));\n --tw-placeholder-opacity: 0.2;\n}\n@keyframes toast-pop {\n\n 0% {\n transform: scale(0.9);\n opacity: 0;\n }\n\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n.tw-btn-xs {\n height: 1.5rem;\n min-height: 1.5rem;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n font-size: 0.75rem;\n}\n.tw-btn-sm {\n height: 2rem;\n min-height: 2rem;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n font-size: 0.875rem;\n}\n.tw-btn-lg {\n height: 4rem;\n min-height: 4rem;\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n font-size: 1.125rem;\n}\n.tw-btn-block {\n width: 100%;\n}\n.tw-btn-square:where(.tw-btn-xs) {\n height: 1.5rem;\n width: 1.5rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-sm) {\n height: 2rem;\n width: 2rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-md) {\n height: 3rem;\n width: 3rem;\n padding: 0px;\n}\n.tw-btn-square:where(.tw-btn-lg) {\n height: 4rem;\n width: 4rem;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-xs) {\n height: 1.5rem;\n width: 1.5rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-sm) {\n height: 2rem;\n width: 2rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-md) {\n height: 3rem;\n width: 3rem;\n border-radius: 9999px;\n padding: 0px;\n}\n.tw-btn-circle:where(.tw-btn-lg) {\n height: 4rem;\n width: 4rem;\n border-radius: 9999px;\n padding: 0px;\n}\n[type=\"checkbox\"].tw-checkbox-xs {\n height: 1rem;\n width: 1rem;\n}\n[type=\"checkbox\"].tw-checkbox-sm {\n height: 1.25rem;\n width: 1.25rem;\n}\n.tw-indicator :where(.tw-indicator-item) {\n bottom: auto;\n inset-inline-end: 0px;\n inset-inline-start: auto;\n top: 0px;\n --tw-translate-y: -50%;\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-start) {\n inset-inline-end: auto;\n inset-inline-start: 0px;\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-start):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-center) {\n inset-inline-end: 50%;\n inset-inline-start: 50%;\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-center):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-end) {\n inset-inline-end: 0px;\n inset-inline-start: auto;\n --tw-translate-x: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-end):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-bottom) {\n bottom: 0px;\n top: auto;\n --tw-translate-y: 50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-middle) {\n bottom: 50%;\n top: 50%;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-indicator :where(.tw-indicator-item.tw-indicator-top) {\n bottom: auto;\n top: 0px;\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-input-md {\n height: 3rem;\n padding-left: 1rem;\n padding-right: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n}\n.tw-input-sm {\n height: 2rem;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n font-size: 0.875rem;\n line-height: 2rem;\n}\n.tw-tabs-md :where(.tw-tab) {\n height: 2rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n line-height: 2;\n --tab-padding: 1rem;\n}\n.tw-tabs-lg :where(.tw-tab) {\n height: 3rem;\n font-size: 1.125rem;\n line-height: 1.75rem;\n line-height: 2;\n --tab-padding: 1.25rem;\n}\n.tw-tabs-sm :where(.tw-tab) {\n height: 1.5rem;\n font-size: 0.875rem;\n line-height: .75rem;\n --tab-padding: 0.75rem;\n}\n.tw-tabs-xs :where(.tw-tab) {\n height: 1.25rem;\n font-size: 0.75rem;\n line-height: .75rem;\n --tab-padding: 0.5rem;\n}\n.tw-tooltip {\n position: relative;\n display: inline-block;\n --tooltip-offset: calc(100% + 1px + var(--tooltip-tail, 0px));\n}\n.tw-tooltip:before {\n position: absolute;\n pointer-events: none;\n z-index: 1;\n content: var(--tw-content);\n --tw-content: attr(data-tip);\n}\n.tw-tooltip:before, .tw-tooltip-top:before {\n transform: translateX(-50%);\n top: auto;\n left: 50%;\n right: auto;\n bottom: var(--tooltip-offset);\n}\n.tw-tooltip-left:before {\n transform: translateY(-50%);\n top: 50%;\n left: auto;\n right: var(--tooltip-offset);\n bottom: auto;\n}\n.tw-tooltip-right:before {\n transform: translateY(-50%);\n top: 50%;\n left: var(--tooltip-offset);\n right: auto;\n bottom: auto;\n}\n.tw-avatar.tw-online:before {\n content: \"\";\n position: absolute;\n z-index: 10;\n display: block;\n border-radius: 9999px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)));\n outline-style: solid;\n outline-width: 2px;\n outline-color: var(--fallback-b1,oklch(var(--b1)/1));\n width: 15%;\n height: 15%;\n top: 7%;\n right: 7%;\n}\n.tw-avatar.tw-offline:before {\n content: \"\";\n position: absolute;\n z-index: 10;\n display: block;\n border-radius: 9999px;\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));\n outline-style: solid;\n outline-width: 2px;\n outline-color: var(--fallback-b1,oklch(var(--b1)/1));\n width: 15%;\n height: 15%;\n top: 7%;\n right: 7%;\n}\n.tw-card-compact .tw-card-body {\n padding: 1rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-card-compact .tw-card-title {\n margin-bottom: 0.25rem;\n}\n.tw-card-normal .tw-card-body {\n padding: var(--padding-card, 2rem);\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-card-normal .tw-card-title {\n margin-bottom: 0.75rem;\n}\n.tw-join.tw-join-vertical > :where(*:not(:first-child)):is(.tw-btn) {\n margin-top: calc(var(--border-btn) * -1);\n}\n.tw-join.tw-join-horizontal > :where(*:not(:first-child)):is(.tw-btn) {\n margin-inline-start: calc(var(--border-btn) * -1);\n margin-top: 0px;\n}\n.tw-modal-top :where(.tw-modal-box) {\n width: 100%;\n max-width: none;\n --tw-translate-y: -2.5rem;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n border-top-left-radius: 0px;\n border-top-right-radius: 0px;\n}\n.tw-modal-middle :where(.tw-modal-box) {\n width: 91.666667%;\n max-width: 32rem;\n --tw-translate-y: 0px;\n --tw-scale-x: .9;\n --tw-scale-y: .9;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n border-bottom-right-radius: var(--rounded-box, 1rem);\n border-bottom-left-radius: var(--rounded-box, 1rem);\n}\n.tw-modal-bottom :where(.tw-modal-box) {\n width: 100%;\n max-width: none;\n --tw-translate-y: 2.5rem;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n border-top-left-radius: var(--rounded-box, 1rem);\n border-top-right-radius: var(--rounded-box, 1rem);\n border-bottom-right-radius: 0px;\n border-bottom-left-radius: 0px;\n}\n.tw-tooltip {\n position: relative;\n display: inline-block;\n text-align: center;\n --tooltip-tail: 0.1875rem;\n --tooltip-color: var(--fallback-n,oklch(var(--n)/1));\n --tooltip-text-color: var(--fallback-nc,oklch(var(--nc)/1));\n --tooltip-tail-offset: calc(100% + 0.0625rem - var(--tooltip-tail));\n}\n.tw-tooltip:before,\n.tw-tooltip:after {\n opacity: 0;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-delay: 100ms;\n transition-duration: 200ms;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n.tw-tooltip:after {\n position: absolute;\n content: \"\";\n border-style: solid;\n border-width: var(--tooltip-tail, 0);\n width: 0;\n height: 0;\n display: block;\n}\n.tw-tooltip:before {\n max-width: 20rem;\n white-space: normal;\n border-radius: 0.25rem;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n background-color: var(--tooltip-color);\n color: var(--tooltip-text-color);\n width: -moz-max-content;\n width: max-content;\n}\n.tw-tooltip.tw-tooltip-open:before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip.tw-tooltip-open:after {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:hover:before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:hover:after {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:has(:focus-visible):after,\n.tw-tooltip:has(:focus-visible):before {\n opacity: 1;\n transition-delay: 75ms;\n}\n.tw-tooltip:not([data-tip]):hover:before,\n.tw-tooltip:not([data-tip]):hover:after {\n visibility: hidden;\n opacity: 0;\n}\n.tw-tooltip:after, .tw-tooltip-top:after {\n transform: translateX(-50%);\n border-color: var(--tooltip-color) transparent transparent transparent;\n top: auto;\n left: 50%;\n right: auto;\n bottom: var(--tooltip-tail-offset);\n}\n.tw-tooltip-left:after {\n transform: translateY(-50%);\n border-color: transparent transparent transparent var(--tooltip-color);\n top: 50%;\n left: auto;\n right: calc(var(--tooltip-tail-offset) + 0.0625rem);\n bottom: auto;\n}\n.tw-tooltip-right:after {\n transform: translateY(-50%);\n border-color: transparent var(--tooltip-color) transparent transparent;\n top: 50%;\n left: calc(var(--tooltip-tail-offset) + 0.0625rem);\n right: auto;\n bottom: auto;\n}\n.tw-pointer-events-none {\n pointer-events: none;\n}\n.tw-pointer-events-auto {\n pointer-events: auto;\n}\n.tw-fixed {\n position: fixed;\n}\n.tw-absolute {\n position: absolute;\n}\n.tw-relative {\n position: relative;\n}\n.tw-inset-y-0 {\n top: 0px;\n bottom: 0px;\n}\n.\\!tw-bottom-24 {\n bottom: 6rem !important;\n}\n.\\!tw-left-0 {\n left: 0px !important;\n}\n.\\!tw-left-auto {\n left: auto !important;\n}\n.-tw-left-6 {\n left: -1.5rem;\n}\n.tw--right-2 {\n right: -0.5rem;\n}\n.tw--top-2 {\n top: -0.5rem;\n}\n.tw-bottom-0 {\n bottom: 0px;\n}\n.tw-bottom-4 {\n bottom: 1rem;\n}\n.tw-left-0 {\n left: 0px;\n}\n.tw-left-1\\/2 {\n left: 50%;\n}\n.tw-left-4 {\n left: 1rem;\n}\n.tw-right-0 {\n right: 0px;\n}\n.tw-right-1 {\n right: 0.25rem;\n}\n.tw-right-2 {\n right: 0.5rem;\n}\n.tw-right-4 {\n right: 1rem;\n}\n.tw-right-5 {\n right: 1.25rem;\n}\n.tw-top-0 {\n top: 0px;\n}\n.tw-top-1 {\n top: 0.25rem;\n}\n.tw-top-14 {\n top: 3.5rem;\n}\n.tw-top-2 {\n top: 0.5rem;\n}\n.tw-top-4 {\n top: 1rem;\n}\n.\\!tw-z-\\[10000\\] {\n z-index: 10000 !important;\n}\n.tw-z-1000 {\n z-index: 1000;\n}\n.tw-z-3000 {\n z-index: 3000;\n}\n.tw-z-500 {\n z-index: 500;\n}\n.tw-z-\\[10000\\] {\n z-index: 10000;\n}\n.tw-z-\\[10035\\] {\n z-index: 10035;\n}\n.tw-z-\\[2000\\] {\n z-index: 2000;\n}\n.tw-z-\\[4000\\] {\n z-index: 4000;\n}\n.tw-z-\\[9998\\] {\n z-index: 9998;\n}\n.tw-z-\\[999\\] {\n z-index: 999;\n}\n.tw-col-span-1 {\n grid-column: span 1 / span 1;\n}\n.tw-float-right {\n float: right;\n}\n.tw-float-left {\n float: left;\n}\n.tw-m-1 {\n margin: 0.25rem;\n}\n.tw-m-4 {\n margin: 1rem;\n}\n.tw-m-auto {\n margin: auto;\n}\n.\\!tw-my-0 {\n margin-top: 0px !important;\n margin-bottom: 0px !important;\n}\n.\\!tw-my-2 {\n margin-top: 0.5rem !important;\n margin-bottom: 0.5rem !important;\n}\n.-tw-mx-4 {\n margin-left: -1rem;\n margin-right: -1rem;\n}\n.tw-mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n}\n.tw-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.tw-mx-6 {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n}\n.tw-mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n.tw-my-1 {\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n}\n.tw-my-10 {\n margin-top: 2.5rem;\n margin-bottom: 2.5rem;\n}\n.tw-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.-tw-mb-1 {\n margin-bottom: -0.25rem;\n}\n.-tw-mb-2 {\n margin-bottom: -0.5rem;\n}\n.-tw-mb-4 {\n margin-bottom: -1rem;\n}\n.-tw-mr-4 {\n margin-right: -1rem;\n}\n.-tw-mr-6 {\n margin-right: -1.5rem;\n}\n.-tw-mt-2 {\n margin-top: -0.5rem;\n}\n.tw-mb-0 {\n margin-bottom: 0px;\n}\n.tw-mb-1 {\n margin-bottom: 0.25rem;\n}\n.tw-mb-10 {\n margin-bottom: 2.5rem;\n}\n.tw-mb-2 {\n margin-bottom: 0.5rem;\n}\n.tw-mb-3 {\n margin-bottom: 0.75rem;\n}\n.tw-mb-4 {\n margin-bottom: 1rem;\n}\n.tw-mb-6 {\n margin-bottom: 1.5rem;\n}\n.tw-ml-1 {\n margin-left: 0.25rem;\n}\n.tw-ml-2 {\n margin-left: 0.5rem;\n}\n.tw-mr-1 {\n margin-right: 0.25rem;\n}\n.tw-mr-2 {\n margin-right: 0.5rem;\n}\n.tw-mr-4 {\n margin-right: 1rem;\n}\n.tw-mr-5 {\n margin-right: 1.25rem;\n}\n.tw-mt-0 {\n margin-top: 0px;\n}\n.tw-mt-1 {\n margin-top: 0.25rem;\n}\n.tw-mt-1\\.5 {\n margin-top: 0.375rem;\n}\n.tw-mt-12 {\n margin-top: 3rem;\n}\n.tw-mt-16 {\n margin-top: 4rem;\n}\n.tw-mt-2 {\n margin-top: 0.5rem;\n}\n.tw-mt-3 {\n margin-top: 0.75rem;\n}\n.tw-mt-4 {\n margin-top: 1rem;\n}\n.tw-mt-5 {\n margin-top: 1.25rem;\n}\n.tw-mt-6 {\n margin-top: 1.5rem;\n}\n.tw-mt-8 {\n margin-top: 2rem;\n}\n.tw-block {\n display: block;\n}\n.tw-inline-block {\n display: inline-block;\n}\n.tw-inline {\n display: inline;\n}\n.tw-flex {\n display: flex;\n}\n.tw-inline-flex {\n display: inline-flex;\n}\n.tw-table {\n display: table;\n}\n.tw-grid {\n display: grid;\n}\n.tw-hidden {\n display: none;\n}\n.tw-h-10 {\n height: 2.5rem;\n}\n.tw-h-12 {\n height: 3rem;\n}\n.tw-h-20 {\n height: 5rem;\n}\n.tw-h-24 {\n height: 6rem;\n}\n.tw-h-28 {\n height: 7rem;\n}\n.tw-h-3 {\n height: 0.75rem;\n}\n.tw-h-3\\/4 {\n height: 75%;\n}\n.tw-h-32 {\n height: 8rem;\n}\n.tw-h-4 {\n height: 1rem;\n}\n.tw-h-40 {\n height: 10rem;\n}\n.tw-h-48 {\n height: 12rem;\n}\n.tw-h-5 {\n height: 1.25rem;\n}\n.tw-h-6 {\n height: 1.5rem;\n}\n.tw-h-8 {\n height: 2rem;\n}\n.tw-h-96 {\n height: 24rem;\n}\n.tw-h-\\[100dvh\\] {\n height: 100dvh;\n}\n.tw-h-\\[2em\\] {\n height: 2em;\n}\n.tw-h-\\[calc\\(100\\%-1rem\\)\\] {\n height: calc(100% - 1rem);\n}\n.tw-h-\\[calc\\(100dvh-268px\\)\\] {\n height: calc(100dvh - 268px);\n}\n.tw-h-\\[calc\\(100dvh-280px\\)\\] {\n height: calc(100dvh - 280px);\n}\n.tw-h-\\[calc\\(100dvh-332px\\)\\] {\n height: calc(100dvh - 332px);\n}\n.tw-h-\\[calc\\(100dvh-64px\\)\\] {\n height: calc(100dvh - 64px);\n}\n.tw-h-\\[calc\\(50\\%-0\\.75em\\)\\] {\n height: calc(50% - 0.75em);\n}\n.tw-h-\\[calc\\(50\\%-1\\.5em\\)\\] {\n height: calc(50% - 1.5em);\n}\n.tw-h-fit {\n height: -moz-fit-content;\n height: fit-content;\n}\n.tw-h-full {\n height: 100%;\n}\n.tw-max-h-64 {\n max-height: 16rem;\n}\n.tw-max-h-\\[calc\\(100dvh-152px\\)\\] {\n max-height: calc(100dvh - 152px);\n}\n.tw-max-h-\\[calc\\(100dvh-96px\\)\\] {\n max-height: calc(100dvh - 96px);\n}\n.tw-min-h-0 {\n min-height: 0px;\n}\n.tw-min-h-56 {\n min-height: 224px;\n}\n.tw-min-h-80 {\n min-height: 320px;\n}\n.tw-min-h-\\[21px\\] {\n min-height: 21px;\n}\n.tw-min-h-\\[5em\\] {\n min-height: 5em;\n}\n.tw-w-1 {\n width: 0.25rem;\n}\n.tw-w-10 {\n width: 2.5rem;\n}\n.tw-w-12 {\n width: 3rem;\n}\n.tw-w-20 {\n width: 5rem;\n}\n.tw-w-28 {\n width: 7rem;\n}\n.tw-w-4 {\n width: 1rem;\n}\n.tw-w-48 {\n width: 12rem;\n}\n.tw-w-5 {\n width: 1.25rem;\n}\n.tw-w-52 {\n width: 13rem;\n}\n.tw-w-6 {\n width: 1.5rem;\n}\n.tw-w-8 {\n width: 2rem;\n}\n.tw-w-80 {\n width: 20rem;\n}\n.tw-w-96 {\n width: 24rem;\n}\n.tw-w-\\[56px\\] {\n width: 56px;\n}\n.tw-w-\\[calc\\(100\\%-32px\\)\\] {\n width: calc(100% - 32px);\n}\n.tw-w-\\[calc\\(100vw-2rem\\)\\] {\n width: calc(100vw - 2rem);\n}\n.tw-w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\n.tw-w-full {\n width: 100%;\n}\n.tw-min-w-0 {\n min-width: 0px;\n}\n.tw-min-w-80 {\n min-width: 320px;\n}\n.tw-min-w-\\[10\\.4em\\] {\n min-width: 10.4em;\n}\n.tw-min-w-\\[10em\\] {\n min-width: 10em;\n}\n.tw-min-w-\\[8rem\\] {\n min-width: 8rem;\n}\n.tw-min-w-fit {\n min-width: -moz-fit-content;\n min-width: fit-content;\n}\n.tw-max-w-3xl {\n max-width: 48rem;\n}\n.tw-max-w-\\[17rem\\] {\n max-width: 17rem;\n}\n.tw-max-w-\\[22rem\\] {\n max-width: 22rem;\n}\n.tw-max-w-\\[calc\\(100\\%-60px\\)\\] {\n max-width: calc(100% - 60px);\n}\n.tw-max-w-full {\n max-width: 100%;\n}\n.tw-max-w-xl {\n max-width: 36rem;\n}\n.tw-max-w-xs {\n max-width: 20rem;\n}\n.tw-flex-1 {\n flex: 1 1 0%;\n}\n.tw-flex-none {\n flex: none;\n}\n.tw-flex-grow {\n flex-grow: 1;\n}\n.tw-grow {\n flex-grow: 1;\n}\n.tw-basis-1\\/5 {\n flex-basis: 20%;\n}\n.tw-basis-2\\/5 {\n flex-basis: 40%;\n}\n.-tw-translate-y-1\\/3 {\n --tw-translate-y: -33.333333%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw--translate-x-1\\/2 {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw--translate-x-full {\n --tw-translate-x: -100%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-translate-x-0 {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-translate-x-1\\/3 {\n --tw-translate-x: 33.333333%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-rotate-180 {\n --tw-rotate: 180deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes tw-pulseGrow {\n\n 0%, 100% {\n transform: scale(1.00);\n }\n\n 80% {\n transform: scale(1.00);\n }\n\n 90% {\n transform: scale(0.95);\n }\n}\n.tw-animate-pulseGrow {\n animation: tw-pulseGrow 2s ease-in-out infinite;\n}\n.tw-cursor-pointer {\n cursor: pointer;\n}\n.tw-cursor-text {\n cursor: text;\n}\n.tw-resize-none {\n resize: none;\n}\n.tw-list-inside {\n list-style-position: inside;\n}\n.tw-list-decimal {\n list-style-type: decimal;\n}\n.tw-list-disc {\n list-style-type: disc;\n}\n.tw-list-none {\n list-style-type: none;\n}\n.tw-columns-1 {\n -moz-columns: 1;\n columns: 1;\n}\n.tw-break-inside-avoid {\n -moz-column-break-inside: avoid;\n break-inside: avoid;\n}\n.tw-grid-flow-col {\n grid-auto-flow: column;\n}\n.tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.tw-grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.tw-grid-cols-6 {\n grid-template-columns: repeat(6, minmax(0, 1fr));\n}\n.tw-flex-row {\n flex-direction: row;\n}\n.tw-flex-col {\n flex-direction: column;\n}\n.tw-flex-wrap {\n flex-wrap: wrap;\n}\n.tw-place-content-center {\n place-content: center;\n}\n.tw-place-content-end {\n place-content: end;\n}\n.tw-place-items-end {\n place-items: end;\n}\n.tw-place-items-center {\n place-items: center;\n}\n.tw-items-center {\n align-items: center;\n}\n.tw-justify-normal {\n justify-content: normal;\n}\n.tw-justify-end {\n justify-content: flex-end;\n}\n.tw-justify-center {\n justify-content: center;\n}\n.tw-justify-between {\n justify-content: space-between;\n}\n.tw-gap-2 {\n gap: 0.5rem;\n}\n.tw-gap-6 {\n gap: 1.5rem;\n}\n.tw-space-x-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.tw-space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.tw-space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.tw-space-y-6 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));\n}\n.tw-place-self-end {\n place-self: end;\n}\n.tw-place-self-center {\n place-self: center;\n}\n.tw-self-center {\n align-self: center;\n}\n.tw-overflow-auto {\n overflow: auto;\n}\n.tw-overflow-hidden {\n overflow: hidden;\n}\n.tw-overflow-scroll {\n overflow: scroll;\n}\n.tw-overflow-x-auto {\n overflow-x: auto;\n}\n.tw-overflow-y-auto {\n overflow-y: auto;\n}\n.tw-overflow-x-hidden {\n overflow-x: hidden;\n}\n.tw-truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.tw-text-ellipsis {\n text-overflow: ellipsis;\n}\n.tw-whitespace-nowrap {\n white-space: nowrap;\n}\n.\\!tw-rounded-none {\n border-radius: 0px !important;\n}\n.tw-rounded {\n border-radius: 0.25rem;\n}\n.tw-rounded-2xl {\n border-radius: 1rem;\n}\n.tw-rounded-box {\n border-radius: var(--rounded-box, 1rem);\n}\n.tw-rounded-full {\n border-radius: 9999px;\n}\n.tw-rounded-lg {\n border-radius: 0.5rem;\n}\n.tw-rounded-md {\n border-radius: 0.375rem;\n}\n.tw-rounded-none {\n border-radius: 0px;\n}\n.tw-rounded-xl {\n border-radius: 0.75rem;\n}\n.tw-rounded-br-md {\n border-bottom-right-radius: 0.375rem;\n}\n.tw-rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.tw-rounded-tr-md {\n border-top-right-radius: 0.375rem;\n}\n.tw-border {\n border-width: 1px;\n}\n.tw-border-0 {\n border-width: 0px;\n}\n.tw-border-4 {\n border-width: 4px;\n}\n.tw-border-\\[1px\\] {\n border-width: 1px;\n}\n.tw-border-t-0 {\n border-top-width: 0px;\n}\n.tw-border-none {\n border-style: none;\n}\n.tw-border-\\[var\\(--fallback-bc\\,oklch\\(var\\(--bc\\)\\/0\\.2\\)\\)\\] {\n border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.tw-border-base-200 {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity, 1)));\n}\n.tw-border-base-300 {\n --tw-border-opacity: 1;\n border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity, 1)));\n}\n.tw-border-current {\n border-color: currentColor;\n}\n.tw-border-gray-300 {\n --tw-border-opacity: 1;\n border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));\n}\n.tw-bg-\\[\\#369acc\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(54 154 204 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#95cf92\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(149 207 146 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#9656a2\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(150 86 162 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#A9DEF9\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(169 222 249 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#D0F4DE\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(208 244 222 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#E4C1F9\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(228 193 249 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#FCF6BD\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(252 246 189 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#FF99C8\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 153 200 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#de324c\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(222 50 76 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#f4895f\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(244 137 95 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#f8e16f\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(248 225 111 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-\\[\\#fff0d6\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 240 214 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-base-100 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-base-200 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-base-300 {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-gray-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-neutral-content {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-nc,oklch(var(--nc)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-primary {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity, 1)));\n}\n.tw-bg-slate-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.tw-bg-transparent {\n background-color: transparent;\n}\n.tw-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.tw-fill-current {\n fill: currentColor;\n}\n.tw-stroke-\\[2\\.5\\] {\n stroke-width: 2.5;\n}\n.tw-stroke-\\[3\\] {\n stroke-width: 3;\n}\n.tw-object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n}\n.\\!tw-p-0 {\n padding: 0px !important;\n}\n.\\!tw-p-4 {\n padding: 1rem !important;\n}\n.\\!tw-p-9 {\n padding: 2.25rem !important;\n}\n.tw-p-0 {\n padding: 0px;\n}\n.tw-p-1 {\n padding: 0.25rem;\n}\n.tw-p-2 {\n padding: 0.5rem;\n}\n.tw-p-3 {\n padding: 0.75rem;\n}\n.tw-p-4 {\n padding: 1rem;\n}\n.tw-p-6 {\n padding: 1.5rem;\n}\n.tw-p-\\[1px\\] {\n padding: 1px;\n}\n.tw-px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.tw-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.tw-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.tw-px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\n.tw-py-0\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n}\n.tw-py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.tw-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.\\!tw-pe-2 {\n padding-inline-end: 0.5rem !important;\n}\n.\\!tw-ps-2 {\n padding-inline-start: 0.5rem !important;\n}\n.tw-pb-0 {\n padding-bottom: 0px;\n}\n.tw-pb-1 {\n padding-bottom: 0.25rem;\n}\n.tw-pb-2 {\n padding-bottom: 0.5rem;\n}\n.tw-pb-4 {\n padding-bottom: 1rem;\n}\n.tw-pb-6 {\n padding-bottom: 1.5rem;\n}\n.tw-pl-2 {\n padding-left: 0.5rem;\n}\n.tw-pr-1 {\n padding-right: 0.25rem;\n}\n.tw-pr-12 {\n padding-right: 3rem;\n}\n.tw-pr-4 {\n padding-right: 1rem;\n}\n.tw-pt-0 {\n padding-top: 0px;\n}\n.tw-pt-1 {\n padding-top: 0.25rem;\n}\n.tw-pt-2 {\n padding-top: 0.5rem;\n}\n.tw-pt-4 {\n padding-top: 1rem;\n}\n.tw-pt-6 {\n padding-top: 1.5rem;\n}\n.tw-text-center {\n text-align: center;\n}\n.tw-text-right {\n text-align: right;\n}\n.tw-align-middle {\n vertical-align: middle;\n}\n.tw-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.tw-text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n}\n.tw-text-6xl {\n font-size: 3.75rem;\n line-height: 1;\n}\n.tw-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.tw-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.tw-text-map {\n font-size: 13px;\n}\n.tw-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.tw-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.tw-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.tw-font-bold {\n font-weight: 700;\n}\n.tw-font-medium {\n font-weight: 500;\n}\n.tw-font-normal {\n font-weight: 400;\n}\n.tw-font-semibold {\n font-weight: 600;\n}\n.tw-normal-case {\n text-transform: none;\n}\n.tw-italic {\n font-style: italic;\n}\n.tw-leading-3 {\n line-height: .75rem;\n}\n.tw-leading-5 {\n line-height: 1.25rem;\n}\n.tw-leading-map {\n line-height: 1.4em;\n}\n.\\!tw-text-base-content {\n --tw-text-opacity: 1 !important;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity, 1))) !important;\n}\n.\\!tw-text-error {\n --tw-text-opacity: 1 !important;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity, 1))) !important;\n}\n.tw-text-base-content {\n --tw-text-opacity: 1;\n color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity, 1)));\n}\n.tw-text-current {\n color: currentColor;\n}\n.tw-text-error {\n --tw-text-opacity: 1;\n color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity, 1)));\n}\n.tw-text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity, 1));\n}\n.tw-text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity, 1));\n}\n.tw-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.tw-text-green-500 {\n --tw-text-opacity: 1;\n color: rgb(34 197 94 / var(--tw-text-opacity, 1));\n}\n.tw-text-primary {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity, 1)));\n}\n.tw-text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tw-text-zinc-500 {\n --tw-text-opacity: 1;\n color: rgb(113 113 122 / var(--tw-text-opacity, 1));\n}\n.tw-underline {\n text-decoration-line: underline;\n}\n.tw-opacity-0 {\n opacity: 0;\n}\n.tw-opacity-100 {\n opacity: 1;\n}\n.tw-opacity-50 {\n opacity: 0.5;\n}\n.tw-shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-md {\n --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tw-drop-shadow-md {\n --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.tw-backdrop-brightness-75 {\n --tw-backdrop-brightness: brightness(.75);\n -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.tw-transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-transition-none {\n transition-property: none;\n}\n.tw-transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.tw-duration-200 {\n transition-duration: 200ms;\n}\n.tw-duration-300 {\n transition-duration: 300ms;\n}\n.tw-duration-500 {\n transition-duration: 500ms;\n}\n.tw-ease-in {\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n}\n.\\[--tab-border-color\\:var\\(--fallback-bc\\2c oklch\\(var\\(--bc\\)\\/0\\.2\\)\\)\\] {\n --tab-border-color: var(--fallback-bc,oklch(var(--bc)/0.2));\n}\n.\\!\\[clip\\:rect\\(0\\2c 0\\2c 0\\2c 0\\)\\] {\n clip: rect(0,0,0,0) !important;\n}\n.\\[clip\\:rect\\(0\\2c 0\\2c 0\\2c 0\\)\\] {\n clip: rect(0,0,0,0);\n}\n.\\[direction\\:ltr\\] {\n direction: ltr;\n}\n.\\[overflow-anchor\\:none\\] {\n overflow-anchor: none;\n}\n.\\[transition\\:background-color_\\.2s_linear\\2c _height_\\.2s_ease-in-out\\] {\n transition: background-color .2s linear, height .2s ease-in-out;\n}\n.\\[transition\\:background-color_\\.2s_linear\\2c _width_\\.2s_ease-in-out\\2c _opacity\\] {\n transition: background-color .2s linear, width .2s ease-in-out, opacity;\n}\n.\\[transition\\:background-color_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\2c box-shadow_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\2c border_250ms_cubic-bezier\\(0\\.4\\2c 0\\2c 0\\.2\\2c 1\\)_0ms\\] {\n transition: background-color 250ms cubic-bezier(0.4,0,0.2,1) 0ms,box-shadow 250ms cubic-bezier(0.4,0,0.2,1) 0ms,border 250ms cubic-bezier(0.4,0,0.2,1) 0ms;\n}\n\n.fade {\n -webkit-mask-image: linear-gradient(180deg, transparent, #000 1%, #000 99%, transparent);\n mask-image: linear-gradient(180deg, transparent, #000 1%, #000 99%, transparent);\n}\n\n.tw-modal {\n z-index: 1200 !important;\n}\n\n.tw-menu li a {\n border-radius: 10px;\n}\n\n.tw-modal {\n z-index: 1200 !important;\n max-height: 100dvh;\n}\n\n.tw-modal-box {\n max-height: calc(100dvh - 2em);\n}\n\n.Toastify__toast {\n border-radius: 1rem;\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n margin-left: 1rem;\n margin-right: 1rem;\n margin-bottom: 1rem;\n background-color: var(--fallback-b1,oklch(var(--b1)/1));\n color: var(--fallback-bc,oklch(var(--bc)/1));\n}\n\n.Toastify__toast-container {\n z-index: 2001 !important;\n}\n\n.Toastify__toast-container--top-right {\n top: 4.75em !important;\n}\n\n:root {\n\n --toastify-color-info: var(--fallback-in,oklch(var(--in)/1));\n --toastify-color-success: var(--fallback-su,oklch(var(--su)/1));\n --toastify-color-warning: var(--fallback-wa,oklch(var(--wa)/1));\n --toastify-color-error: var(--fallback-er,oklch(var(--er)/1));\n\n}\n\n.placeholder-center::-moz-placeholder {\n text-align: center;\n}\n\n.placeholder-center::placeholder {\n text-align: center;\n}\n\n.custom-file-upload {\n cursor: pointer;\n}\n\ninput[type=\"file\"] {\n display: none;\n}\n\n.custom-file-upload:hover .button {\n opacity: 0.8;\n}\n\n.custom-file-upload .button {\n transition: .5s ease;\n opacity: 0;\n position: absolute;\n transform: translate(8px, 8px);\n\n}\n\n.tw-tab-content .container {\n height: 100%;\n}\n\n.masonry {\n -moz-column-count: 1;\n column-count: 1;\n -moz-column-gap: 1.5rem;\n column-gap: 1.5rem;\n}\n.masonry-item {\n -moz-column-break-inside: avoid;\n break-inside: avoid;\n margin-bottom: 1.5rem;\n}\n@media (min-width: 640px) {\n .masonry {\n -moz-column-count: 2;\n column-count: 2;\n }\n}\n@media (min-width: 1024px) {\n .masonry {\n -moz-column-count: 3;\n column-count: 3;\n }\n}\n@media (min-width: 1536px) {\n .masonry {\n -moz-column-count: 4;\n column-count: 4;\n }\n}\n@media (min-width: 640px) {\n\n .sm\\:tw-table-sm :not(thead):not(tfoot) tr {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .sm\\:tw-table-sm :where(th, td) {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n}\n@media (min-width: 768px) {\n\n .md\\:tw-table-md :not(thead):not(tfoot) tr {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .md\\:tw-table-md :where(th, td) {\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n}\n.hover\\:tw-cursor-pointer:hover {\n cursor: pointer;\n}\n.hover\\:tw-bg-base-200:hover {\n --tw-bg-opacity: 1;\n background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity, 1)));\n}\n.hover\\:tw-bg-slate-300:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(203 213 225 / var(--tw-bg-opacity, 1));\n}\n.hover\\:tw-bg-transparent:hover {\n background-color: transparent;\n}\n.hover\\:tw-font-bold:hover {\n font-weight: 700;\n}\n.hover\\:tw-text-primary:hover {\n --tw-text-opacity: 1;\n color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity, 1)));\n}\n.hover\\:tw-underline:hover {\n text-decoration-line: underline;\n}\n.focus\\:tw-border-indigo-500:focus {\n --tw-border-opacity: 1;\n border-color: rgb(99 102 241 / var(--tw-border-opacity, 1));\n}\n.focus\\:tw-outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.focus\\:tw-ring-indigo-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));\n}\n.data-\\[te-sidenav-slim\\=\\'true\\'\\]\\:tw-hidden[data-te-sidenav-slim='true'] {\n display: none;\n}\n.data-\\[te-sidenav-slim-collapsed\\=\\'true\\'\\]\\:tw-w-\\[56px\\][data-te-sidenav-slim-collapsed='true'] {\n width: 56px;\n}\n.data-\\[te-sidenav-slim\\=\\'true\\'\\]\\:tw-w-\\[56px\\][data-te-sidenav-slim='true'] {\n width: 56px;\n}\n.data-\\[te-sidenav-hidden\\=\\'false\\'\\]\\:tw-translate-x-0[data-te-sidenav-hidden='false'] {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tw-group[data-te-sidenav-slim-collapsed='true'] .group-\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\]\\:data-\\[te-sidenav-slim\\=\\'false\\'\\]\\:tw-hidden[data-te-sidenav-slim='false'] {\n display: none;\n}\n@media (min-width: 640px) {\n\n .sm\\:\\!tw-left-auto {\n left: auto !important;\n }\n\n .sm\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .sm\\:tw-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n}\n@media (min-width: 768px) {\n\n .md\\:tw-mb-0 {\n margin-bottom: 0px;\n }\n\n .md\\:tw-flex {\n display: flex;\n }\n\n .md\\:tw-hidden {\n display: none;\n }\n\n .md\\:tw-w-1\\/2 {\n width: 50%;\n }\n\n .md\\:tw-w-\\[calc\\(50\\%-32px\\)\\] {\n width: calc(50% - 32px);\n }\n\n .md\\:tw-columns-2 {\n -moz-columns: 2;\n columns: 2;\n }\n\n .md\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .md\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .md\\:tw-space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\:tw-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n}\n@media (min-width: 1024px) {\n\n .lg\\:tw-columns-3 {\n -moz-columns: 3;\n columns: 3;\n }\n\n .lg\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n}\n@media (min-width: 1280px) {\n\n .xl\\:tw-max-w-6xl {\n max-width: 72rem;\n }\n\n .xl\\:tw-grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .xl\\:tw-text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n }\n}\n@media (min-width: 1536px) {\n\n .\\32xl\\:tw-columns-4 {\n -moz-columns: 4;\n columns: 4;\n }\n\n .\\32xl\\:tw-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.rtl\\:\\[direction\\:rtl\\]:where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n direction: rtl;\n}\n@media (prefers-color-scheme: dark) {\n\n .dark\\:tw-bg-zinc-800 {\n --tw-bg-opacity: 1;\n background-color: rgb(39 39 42 / var(--tw-bg-opacity, 1));\n }\n}\n.\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\[data-te-sidenav-slim\\=\\'false\\'\\]\\]\\:tw-hidden[data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='false'] {\n display: none;\n}\n.\\[\\&\\[data-te-sidenav-slim-collapsed\\=\\'true\\'\\]\\[data-te-sidenav-slim\\=\\'true\\'\\]\\]\\:\\[display\\:unset\\][data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='true'] {\n display: unset;\n}";
|
|
58
77
|
styleInject(css_248z$4);
|
|
59
78
|
|
|
60
|
-
const QuestContext =
|
|
79
|
+
const QuestContext = React.createContext({
|
|
61
80
|
open: false,
|
|
62
81
|
setQuestsOpen: () => { },
|
|
63
82
|
});
|
|
64
83
|
function useQuestsManager(initialOpen) {
|
|
65
|
-
const [open, setOpen] =
|
|
66
|
-
const setQuestsOpen =
|
|
84
|
+
const [open, setOpen] = React.useState(initialOpen);
|
|
85
|
+
const setQuestsOpen = React.useCallback((questOpen) => {
|
|
67
86
|
setOpen(questOpen);
|
|
68
87
|
}, []);
|
|
69
88
|
return { open, setQuestsOpen };
|
|
70
89
|
}
|
|
71
|
-
const QuestsProvider = ({ initialOpen, children }) => (jsxRuntime.jsx(QuestContext.Provider, { value: useQuestsManager(initialOpen), children: children }));
|
|
90
|
+
const QuestsProvider = ({ initialOpen, children, }) => (jsxRuntime.jsx(QuestContext.Provider, { value: useQuestsManager(initialOpen), children: children }));
|
|
72
91
|
const useQuestsOpen = () => {
|
|
73
|
-
const { open } =
|
|
92
|
+
const { open } = React.useContext(QuestContext);
|
|
74
93
|
return open;
|
|
75
94
|
};
|
|
76
95
|
const useSetQuestOpen = () => {
|
|
77
|
-
const { setQuestsOpen } =
|
|
96
|
+
const { setQuestsOpen } = React.useContext(QuestContext);
|
|
78
97
|
return setQuestsOpen;
|
|
79
98
|
};
|
|
80
99
|
|
|
81
|
-
const ClusterRefContext =
|
|
100
|
+
const ClusterRefContext = React.createContext({
|
|
82
101
|
clusterRef: {},
|
|
83
102
|
setClusterRef: () => { },
|
|
84
103
|
});
|
|
85
104
|
function useClusterRefManager() {
|
|
86
|
-
const [clusterRef, setClusterRef] =
|
|
105
|
+
const [clusterRef, setClusterRef] = React.useState({});
|
|
87
106
|
return { clusterRef, setClusterRef };
|
|
88
107
|
}
|
|
89
108
|
const ClusterRefProvider = ({ children }) => (jsxRuntime.jsx(ClusterRefContext.Provider, { value: useClusterRefManager(), children: children }));
|
|
90
109
|
const useClusterRef = () => {
|
|
91
|
-
const { clusterRef } =
|
|
110
|
+
const { clusterRef } = React.useContext(ClusterRefContext);
|
|
92
111
|
return clusterRef;
|
|
93
112
|
};
|
|
94
113
|
const useSetClusterRef = () => {
|
|
95
|
-
const { setClusterRef } =
|
|
114
|
+
const { setClusterRef } = React.useContext(ClusterRefContext);
|
|
96
115
|
return setClusterRef;
|
|
97
116
|
};
|
|
98
117
|
|
|
99
|
-
const LayerContext =
|
|
118
|
+
const LayerContext = React.createContext({
|
|
100
119
|
layers: [],
|
|
120
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
101
121
|
addLayer: () => { },
|
|
102
122
|
});
|
|
103
123
|
function useLayerManager(initialLayers) {
|
|
104
|
-
const [layers, dispatch] =
|
|
124
|
+
const [layers, dispatch] = React.useReducer((state, action) => {
|
|
105
125
|
switch (action.type) {
|
|
106
126
|
case 'ADD LAYER':
|
|
107
127
|
// eslint-disable-next-line no-case-declarations
|
|
@@ -115,7 +135,7 @@ function useLayerManager(initialLayers) {
|
|
|
115
135
|
throw new Error();
|
|
116
136
|
}
|
|
117
137
|
}, initialLayers);
|
|
118
|
-
const addLayer =
|
|
138
|
+
const addLayer = React.useCallback((layer) => {
|
|
119
139
|
dispatch({
|
|
120
140
|
type: 'ADD LAYER',
|
|
121
141
|
layer,
|
|
@@ -125,11 +145,11 @@ function useLayerManager(initialLayers) {
|
|
|
125
145
|
}
|
|
126
146
|
const LayersProvider = ({ initialLayers, children }) => (jsxRuntime.jsx(LayerContext.Provider, { value: useLayerManager(initialLayers), children: children }));
|
|
127
147
|
const useLayers = () => {
|
|
128
|
-
const { layers } =
|
|
148
|
+
const { layers } = React.useContext(LayerContext);
|
|
129
149
|
return layers;
|
|
130
150
|
};
|
|
131
151
|
const useAddLayer = () => {
|
|
132
|
-
const { addLayer } =
|
|
152
|
+
const { addLayer } = React.useContext(LayerContext);
|
|
133
153
|
return addLayer;
|
|
134
154
|
};
|
|
135
155
|
|
|
@@ -141,8 +161,8 @@ function getWindowDimensions() {
|
|
|
141
161
|
};
|
|
142
162
|
}
|
|
143
163
|
function useWindowDimensions() {
|
|
144
|
-
const [windowDimensions, setWindowDimensions] =
|
|
145
|
-
|
|
164
|
+
const [windowDimensions, setWindowDimensions] = React.useState(getWindowDimensions());
|
|
165
|
+
React.useEffect(() => {
|
|
146
166
|
function handleResize() {
|
|
147
167
|
setWindowDimensions(getWindowDimensions());
|
|
148
168
|
}
|
|
@@ -152,7 +172,7 @@ function useWindowDimensions() {
|
|
|
152
172
|
return windowDimensions;
|
|
153
173
|
}
|
|
154
174
|
|
|
155
|
-
const FilterContext =
|
|
175
|
+
const FilterContext = React.createContext({
|
|
156
176
|
filterTags: [],
|
|
157
177
|
searchPhrase: '',
|
|
158
178
|
visibleLayers: [],
|
|
@@ -170,7 +190,7 @@ const FilterContext = react.createContext({
|
|
|
170
190
|
isGroupTypeVisible: () => true,
|
|
171
191
|
});
|
|
172
192
|
function useFilterManager(initialTags) {
|
|
173
|
-
const [filterTags, dispatchTags] =
|
|
193
|
+
const [filterTags, dispatchTags] = React.useReducer((state, action) => {
|
|
174
194
|
switch (action.type) {
|
|
175
195
|
case 'ADD_TAG':
|
|
176
196
|
const exist = state.find((tag) => tag.id === action.tag.id);
|
|
@@ -190,7 +210,7 @@ function useFilterManager(initialTags) {
|
|
|
190
210
|
const initialLayers = useLayers();
|
|
191
211
|
const navigate = reactRouterDom.useNavigate();
|
|
192
212
|
const windowDimensions = useWindowDimensions();
|
|
193
|
-
const [visibleLayers, dispatchLayers] =
|
|
213
|
+
const [visibleLayers, dispatchLayers] = React.useReducer((state, action) => {
|
|
194
214
|
switch (action.type) {
|
|
195
215
|
case 'ADD_LAYER':
|
|
196
216
|
const exist1 = state.find((layer) => layer.name === action.layer.name);
|
|
@@ -211,7 +231,7 @@ function useFilterManager(initialTags) {
|
|
|
211
231
|
throw new Error();
|
|
212
232
|
}
|
|
213
233
|
}, initialLayers);
|
|
214
|
-
const [visibleGroupTypes, dispatchGroupTypes] =
|
|
234
|
+
const [visibleGroupTypes, dispatchGroupTypes] = React.useReducer((state, action) => {
|
|
215
235
|
switch (action.type) {
|
|
216
236
|
case 'ADD_GROUP_TYPE':
|
|
217
237
|
const exist1 = state.find((groupType) => groupType === action.groupType);
|
|
@@ -232,8 +252,8 @@ function useFilterManager(initialTags) {
|
|
|
232
252
|
throw new Error();
|
|
233
253
|
}
|
|
234
254
|
}, []);
|
|
235
|
-
const [searchPhrase, searchPhraseSet] =
|
|
236
|
-
const addFilterTag =
|
|
255
|
+
const [searchPhrase, searchPhraseSet] = React.useState('');
|
|
256
|
+
const addFilterTag = React.useCallback((tag) => {
|
|
237
257
|
const params = new URLSearchParams(location.search);
|
|
238
258
|
const urlTags = params.get('tags');
|
|
239
259
|
const decodedTags = urlTags ? decodeURIComponent(urlTags) : '';
|
|
@@ -250,7 +270,7 @@ function useFilterManager(initialTags) {
|
|
|
250
270
|
});
|
|
251
271
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
252
272
|
}, []);
|
|
253
|
-
const removeFilterTag =
|
|
273
|
+
const removeFilterTag = React.useCallback((name) => {
|
|
254
274
|
const params = new URLSearchParams(window.location.search);
|
|
255
275
|
const urlTags = params.get('tags');
|
|
256
276
|
let newUrlTags = '';
|
|
@@ -277,7 +297,7 @@ function useFilterManager(initialTags) {
|
|
|
277
297
|
});
|
|
278
298
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
279
299
|
}, []);
|
|
280
|
-
const resetFilterTags =
|
|
300
|
+
const resetFilterTags = React.useCallback(() => {
|
|
281
301
|
dispatchTags({
|
|
282
302
|
type: 'RESET_TAGS',
|
|
283
303
|
});
|
|
@@ -294,12 +314,12 @@ function useFilterManager(initialTags) {
|
|
|
294
314
|
layer,
|
|
295
315
|
});
|
|
296
316
|
};
|
|
297
|
-
const resetVisibleLayers =
|
|
317
|
+
const resetVisibleLayers = React.useCallback(() => {
|
|
298
318
|
dispatchLayers({
|
|
299
319
|
type: 'RESET_LAYERS',
|
|
300
320
|
});
|
|
301
321
|
}, []);
|
|
302
|
-
const isLayerVisible =
|
|
322
|
+
const isLayerVisible = React.useCallback((layer) => {
|
|
303
323
|
return visibleLayers.some((l) => l.name === layer.name);
|
|
304
324
|
}, [visibleLayers]);
|
|
305
325
|
const addVisibleGroupType = (groupType) => {
|
|
@@ -314,10 +334,10 @@ function useFilterManager(initialTags) {
|
|
|
314
334
|
groupType,
|
|
315
335
|
});
|
|
316
336
|
};
|
|
317
|
-
const isGroupTypeVisible =
|
|
337
|
+
const isGroupTypeVisible = React.useCallback((groupType) => {
|
|
318
338
|
return visibleGroupTypes.some((gt) => gt === groupType);
|
|
319
339
|
}, [visibleGroupTypes]);
|
|
320
|
-
const setSearchPhrase =
|
|
340
|
+
const setSearchPhrase = React.useCallback((phrase) => {
|
|
321
341
|
searchPhraseSet(phrase);
|
|
322
342
|
}, []);
|
|
323
343
|
return {
|
|
@@ -340,51 +360,51 @@ function useFilterManager(initialTags) {
|
|
|
340
360
|
}
|
|
341
361
|
const FilterProvider = ({ initialTags, children }) => (jsxRuntime.jsx(FilterContext.Provider, { value: useFilterManager(initialTags), children: children }));
|
|
342
362
|
const useFilterTags = () => {
|
|
343
|
-
const { filterTags } =
|
|
363
|
+
const { filterTags } = React.useContext(FilterContext);
|
|
344
364
|
return filterTags;
|
|
345
365
|
};
|
|
346
366
|
const useAddFilterTag = () => {
|
|
347
|
-
const { addFilterTag } =
|
|
367
|
+
const { addFilterTag } = React.useContext(FilterContext);
|
|
348
368
|
return addFilterTag;
|
|
349
369
|
};
|
|
350
370
|
const useRemoveFilterTag = () => {
|
|
351
|
-
const { removeFilterTag } =
|
|
371
|
+
const { removeFilterTag } = React.useContext(FilterContext);
|
|
352
372
|
return removeFilterTag;
|
|
353
373
|
};
|
|
354
374
|
const useResetFilterTags = () => {
|
|
355
|
-
const { resetFilterTags } =
|
|
375
|
+
const { resetFilterTags } = React.useContext(FilterContext);
|
|
356
376
|
return resetFilterTags;
|
|
357
377
|
};
|
|
358
378
|
const useAddVisibleLayer = () => {
|
|
359
|
-
const { addVisibleLayer } =
|
|
379
|
+
const { addVisibleLayer } = React.useContext(FilterContext);
|
|
360
380
|
return addVisibleLayer;
|
|
361
381
|
};
|
|
362
382
|
const useToggleVisibleLayer = () => {
|
|
363
|
-
const { toggleVisibleLayer } =
|
|
383
|
+
const { toggleVisibleLayer } = React.useContext(FilterContext);
|
|
364
384
|
return toggleVisibleLayer;
|
|
365
385
|
};
|
|
366
386
|
const useIsLayerVisible = () => {
|
|
367
|
-
const { isLayerVisible } =
|
|
387
|
+
const { isLayerVisible } = React.useContext(FilterContext);
|
|
368
388
|
return isLayerVisible;
|
|
369
389
|
};
|
|
370
390
|
const useAddVisibleGroupType = () => {
|
|
371
|
-
const { addVisibleGroupType } =
|
|
391
|
+
const { addVisibleGroupType } = React.useContext(FilterContext);
|
|
372
392
|
return addVisibleGroupType;
|
|
373
393
|
};
|
|
374
394
|
const useToggleVisibleGroupType = () => {
|
|
375
|
-
const { toggleVisibleGroupType } =
|
|
395
|
+
const { toggleVisibleGroupType } = React.useContext(FilterContext);
|
|
376
396
|
return toggleVisibleGroupType;
|
|
377
397
|
};
|
|
378
398
|
const useIsGroupTypeVisible = () => {
|
|
379
|
-
const { isGroupTypeVisible } =
|
|
399
|
+
const { isGroupTypeVisible } = React.useContext(FilterContext);
|
|
380
400
|
return isGroupTypeVisible;
|
|
381
401
|
};
|
|
382
402
|
const useVisibleGroupType = () => {
|
|
383
|
-
const { visibleGroupTypes } =
|
|
403
|
+
const { visibleGroupTypes } = React.useContext(FilterContext);
|
|
384
404
|
return visibleGroupTypes;
|
|
385
405
|
};
|
|
386
406
|
|
|
387
|
-
const ItemContext =
|
|
407
|
+
const ItemContext = React.createContext({
|
|
388
408
|
items: [],
|
|
389
409
|
addItem: () => { },
|
|
390
410
|
updateItem: () => { },
|
|
@@ -396,8 +416,8 @@ const ItemContext = react.createContext({
|
|
|
396
416
|
});
|
|
397
417
|
function useItemsManager(initialItems) {
|
|
398
418
|
const addLayer = useAddLayer();
|
|
399
|
-
const [allItemsLoaded, setallItemsLoaded] =
|
|
400
|
-
const [items, dispatch] =
|
|
419
|
+
const [allItemsLoaded, setallItemsLoaded] = React.useState(false);
|
|
420
|
+
const [items, dispatch] = React.useReducer((state, action) => {
|
|
401
421
|
switch (action.type) {
|
|
402
422
|
case 'ADD':
|
|
403
423
|
// eslint-disable-next-line no-case-declarations
|
|
@@ -422,7 +442,7 @@ function useItemsManager(initialItems) {
|
|
|
422
442
|
throw new Error();
|
|
423
443
|
}
|
|
424
444
|
}, initialItems);
|
|
425
|
-
const setItemsApi =
|
|
445
|
+
const setItemsApi = React.useCallback(async (layer) => {
|
|
426
446
|
addLayer(layer);
|
|
427
447
|
const result = await reactToastify.toast.promise(layer.api.getItems(), {
|
|
428
448
|
pending: `loading ${layer.name} ...`,
|
|
@@ -434,14 +454,13 @@ function useItemsManager(initialItems) {
|
|
|
434
454
|
},
|
|
435
455
|
});
|
|
436
456
|
result.map((item) => {
|
|
437
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
438
457
|
dispatch({ type: 'ADD', item: { ...item, layer } });
|
|
439
458
|
return null;
|
|
440
459
|
});
|
|
441
460
|
setallItemsLoaded(true);
|
|
442
461
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
443
462
|
}, []);
|
|
444
|
-
const setItemsData =
|
|
463
|
+
const setItemsData = React.useCallback((layer) => {
|
|
445
464
|
addLayer(layer);
|
|
446
465
|
layer.data?.map((item) => {
|
|
447
466
|
dispatch({ type: 'ADD', item: { ...item, layer } });
|
|
@@ -450,25 +469,25 @@ function useItemsManager(initialItems) {
|
|
|
450
469
|
setallItemsLoaded(true);
|
|
451
470
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
452
471
|
}, []);
|
|
453
|
-
const addItem =
|
|
472
|
+
const addItem = React.useCallback(async (item) => {
|
|
454
473
|
dispatch({
|
|
455
474
|
type: 'ADD',
|
|
456
475
|
item,
|
|
457
476
|
});
|
|
458
477
|
}, []);
|
|
459
|
-
const updateItem =
|
|
478
|
+
const updateItem = React.useCallback(async (item) => {
|
|
460
479
|
dispatch({
|
|
461
480
|
type: 'UPDATE',
|
|
462
481
|
item,
|
|
463
482
|
});
|
|
464
483
|
}, []);
|
|
465
|
-
const removeItem =
|
|
484
|
+
const removeItem = React.useCallback((item) => {
|
|
466
485
|
dispatch({
|
|
467
486
|
type: 'REMOVE',
|
|
468
487
|
item,
|
|
469
488
|
});
|
|
470
489
|
}, []);
|
|
471
|
-
const resetItems =
|
|
490
|
+
const resetItems = React.useCallback((layer) => {
|
|
472
491
|
dispatch({
|
|
473
492
|
type: 'RESET',
|
|
474
493
|
layer,
|
|
@@ -487,41 +506,41 @@ function useItemsManager(initialItems) {
|
|
|
487
506
|
}
|
|
488
507
|
const ItemsProvider = ({ initialItems, children }) => (jsxRuntime.jsx(ItemContext.Provider, { value: useItemsManager(initialItems), children: children }));
|
|
489
508
|
const useItems = () => {
|
|
490
|
-
const { items } =
|
|
509
|
+
const { items } = React.useContext(ItemContext);
|
|
491
510
|
return items;
|
|
492
511
|
};
|
|
493
512
|
const useAddItem = () => {
|
|
494
|
-
const { addItem } =
|
|
513
|
+
const { addItem } = React.useContext(ItemContext);
|
|
495
514
|
return addItem;
|
|
496
515
|
};
|
|
497
516
|
const useUpdateItem = () => {
|
|
498
|
-
const { updateItem } =
|
|
517
|
+
const { updateItem } = React.useContext(ItemContext);
|
|
499
518
|
return updateItem;
|
|
500
519
|
};
|
|
501
520
|
const useRemoveItem = () => {
|
|
502
|
-
const { removeItem } =
|
|
521
|
+
const { removeItem } = React.useContext(ItemContext);
|
|
503
522
|
return removeItem;
|
|
504
523
|
};
|
|
505
524
|
const useSetItemsApi = () => {
|
|
506
|
-
const { setItemsApi } =
|
|
525
|
+
const { setItemsApi } = React.useContext(ItemContext);
|
|
507
526
|
return setItemsApi;
|
|
508
527
|
};
|
|
509
528
|
const useSetItemsData = () => {
|
|
510
|
-
const { setItemsData } =
|
|
529
|
+
const { setItemsData } = React.useContext(ItemContext);
|
|
511
530
|
return setItemsData;
|
|
512
531
|
};
|
|
513
532
|
const useAllItemsLoaded = () => {
|
|
514
|
-
const { allItemsLoaded } =
|
|
533
|
+
const { allItemsLoaded } = React.useContext(ItemContext);
|
|
515
534
|
return allItemsLoaded;
|
|
516
535
|
};
|
|
517
536
|
|
|
518
|
-
const LeafletRefsContext =
|
|
537
|
+
const LeafletRefsContext = React.createContext({
|
|
519
538
|
leafletRefs: {},
|
|
520
539
|
addMarker: () => { },
|
|
521
540
|
addPopup: () => { },
|
|
522
541
|
});
|
|
523
542
|
function useLeafletRefsManager(initialLeafletRefs) {
|
|
524
|
-
const [leafletRefs, dispatch] =
|
|
543
|
+
const [leafletRefs, dispatch] = React.useReducer((state, action) => {
|
|
525
544
|
switch (action.type) {
|
|
526
545
|
case 'ADD_MARKER':
|
|
527
546
|
return {
|
|
@@ -541,14 +560,14 @@ function useLeafletRefsManager(initialLeafletRefs) {
|
|
|
541
560
|
throw new Error();
|
|
542
561
|
}
|
|
543
562
|
}, initialLeafletRefs);
|
|
544
|
-
const addMarker =
|
|
563
|
+
const addMarker = React.useCallback((item, marker) => {
|
|
545
564
|
dispatch({
|
|
546
565
|
type: 'ADD_MARKER',
|
|
547
566
|
item,
|
|
548
567
|
marker,
|
|
549
568
|
});
|
|
550
569
|
}, []);
|
|
551
|
-
const addPopup =
|
|
570
|
+
const addPopup = React.useCallback((item, popup) => {
|
|
552
571
|
dispatch({
|
|
553
572
|
type: 'ADD_POPUP',
|
|
554
573
|
item,
|
|
@@ -559,19 +578,19 @@ function useLeafletRefsManager(initialLeafletRefs) {
|
|
|
559
578
|
}
|
|
560
579
|
const LeafletRefsProvider = ({ initialLeafletRefs, children }) => (jsxRuntime.jsx(LeafletRefsContext.Provider, { value: useLeafletRefsManager(initialLeafletRefs), children: children }));
|
|
561
580
|
const useLeafletRefs = () => {
|
|
562
|
-
const { leafletRefs } =
|
|
581
|
+
const { leafletRefs } = React.useContext(LeafletRefsContext);
|
|
563
582
|
return leafletRefs;
|
|
564
583
|
};
|
|
565
584
|
const useAddMarker = () => {
|
|
566
|
-
const { addMarker } =
|
|
585
|
+
const { addMarker } = React.useContext(LeafletRefsContext);
|
|
567
586
|
return addMarker;
|
|
568
587
|
};
|
|
569
588
|
const useAddPopup = () => {
|
|
570
|
-
const { addPopup } =
|
|
589
|
+
const { addPopup } = React.useContext(LeafletRefsContext);
|
|
571
590
|
return addPopup;
|
|
572
591
|
};
|
|
573
592
|
|
|
574
|
-
const AuthContext =
|
|
593
|
+
const AuthContext = React.createContext({
|
|
575
594
|
isAuthenticated: false,
|
|
576
595
|
user: null,
|
|
577
596
|
login: () => Promise.reject(Error('Unimplemented')),
|
|
@@ -587,12 +606,13 @@ const AuthContext = react.createContext({
|
|
|
587
606
|
* @category Auth
|
|
588
607
|
*/
|
|
589
608
|
const AuthProvider = ({ userApi, children }) => {
|
|
590
|
-
const [user, setUser] =
|
|
591
|
-
const [token, setToken] =
|
|
592
|
-
const [loading, setLoading] =
|
|
609
|
+
const [user, setUser] = React.useState(null);
|
|
610
|
+
const [token, setToken] = React.useState();
|
|
611
|
+
const [loading, setLoading] = React.useState(false);
|
|
593
612
|
const isAuthenticated = !!user;
|
|
594
|
-
|
|
613
|
+
React.useEffect(() => {
|
|
595
614
|
setLoading(true);
|
|
615
|
+
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
596
616
|
loadUser();
|
|
597
617
|
setLoading(false);
|
|
598
618
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -619,8 +639,8 @@ const AuthProvider = ({ userApi, children }) => {
|
|
|
619
639
|
const login = async (credentials) => {
|
|
620
640
|
setLoading(true);
|
|
621
641
|
try {
|
|
622
|
-
const
|
|
623
|
-
setToken(
|
|
642
|
+
const user = await userApi.login(credentials.email, credentials.password);
|
|
643
|
+
setToken(user?.access_token);
|
|
624
644
|
return await loadUser();
|
|
625
645
|
}
|
|
626
646
|
catch (error) {
|
|
@@ -651,13 +671,12 @@ const AuthProvider = ({ userApi, children }) => {
|
|
|
651
671
|
};
|
|
652
672
|
const updateUser = async (user) => {
|
|
653
673
|
setLoading(true);
|
|
654
|
-
const { id, ...userRest } = user;
|
|
655
674
|
try {
|
|
656
|
-
const
|
|
657
|
-
setUser(
|
|
658
|
-
loadUser();
|
|
675
|
+
const updatedUser = await userApi.updateUser(user);
|
|
676
|
+
setUser(updatedUser);
|
|
677
|
+
await loadUser();
|
|
659
678
|
setLoading(false);
|
|
660
|
-
return
|
|
679
|
+
return updatedUser;
|
|
661
680
|
}
|
|
662
681
|
catch (error) {
|
|
663
682
|
setLoading(false);
|
|
@@ -699,9 +718,9 @@ const AuthProvider = ({ userApi, children }) => {
|
|
|
699
718
|
passwordReset,
|
|
700
719
|
}, children: children }));
|
|
701
720
|
};
|
|
702
|
-
const useAuth = () =>
|
|
721
|
+
const useAuth = () => React.useContext(AuthContext);
|
|
703
722
|
|
|
704
|
-
const PermissionContext =
|
|
723
|
+
const PermissionContext = React.createContext({
|
|
705
724
|
permissions: [],
|
|
706
725
|
setPermissionApi: () => { },
|
|
707
726
|
setPermissionData: () => { },
|
|
@@ -709,7 +728,7 @@ const PermissionContext = react.createContext({
|
|
|
709
728
|
hasUserPermission: () => true,
|
|
710
729
|
});
|
|
711
730
|
function usePermissionsManager(initialPermissions) {
|
|
712
|
-
const [permissions, dispatch] =
|
|
731
|
+
const [permissions, dispatch] = React.useReducer((state, action) => {
|
|
713
732
|
switch (action.type) {
|
|
714
733
|
case 'ADD':
|
|
715
734
|
// eslint-disable-next-line no-case-declarations
|
|
@@ -725,22 +744,22 @@ function usePermissionsManager(initialPermissions) {
|
|
|
725
744
|
throw new Error();
|
|
726
745
|
}
|
|
727
746
|
}, initialPermissions);
|
|
728
|
-
const [adminRole, setAdminRole] =
|
|
747
|
+
const [adminRole, setAdminRole] = React.useState(null);
|
|
729
748
|
const { user } = useAuth();
|
|
730
|
-
const setPermissionApi =
|
|
749
|
+
const setPermissionApi = React.useCallback(async (api) => {
|
|
731
750
|
const result = await api.getItems();
|
|
732
751
|
result.map((permission) => {
|
|
733
752
|
dispatch({ type: 'ADD', permission });
|
|
734
753
|
return null;
|
|
735
754
|
});
|
|
736
755
|
}, []);
|
|
737
|
-
const setPermissionData =
|
|
756
|
+
const setPermissionData = React.useCallback((data) => {
|
|
738
757
|
data.map((permission) => {
|
|
739
758
|
dispatch({ type: 'ADD', permission });
|
|
740
759
|
return null;
|
|
741
760
|
});
|
|
742
761
|
}, []);
|
|
743
|
-
const hasUserPermission =
|
|
762
|
+
const hasUserPermission = React.useCallback((collectionName, action, item, layer) => {
|
|
744
763
|
const evaluateCondition = (condition) => {
|
|
745
764
|
if (condition.user_created?._eq === '$CURRENT_USER') {
|
|
746
765
|
return item?.user_created?.id === user?.id;
|
|
@@ -751,7 +770,7 @@ function usePermissionsManager(initialPermissions) {
|
|
|
751
770
|
return false;
|
|
752
771
|
};
|
|
753
772
|
const evaluatePermissions = (permissionConditions) => {
|
|
754
|
-
if (!permissionConditions
|
|
773
|
+
if (!permissionConditions?._and) {
|
|
755
774
|
return true;
|
|
756
775
|
}
|
|
757
776
|
return permissionConditions._and.every((andCondition) => andCondition._or
|
|
@@ -763,12 +782,12 @@ function usePermissionsManager(initialPermissions) {
|
|
|
763
782
|
// Bedingung für leere Berechtigungen nur, wenn NICHT item und create
|
|
764
783
|
if (permissions.length === 0)
|
|
765
784
|
return true;
|
|
766
|
-
else if (user && user.role
|
|
785
|
+
else if (user && user.role?.id === adminRole)
|
|
767
786
|
return true;
|
|
768
787
|
else {
|
|
769
788
|
return permissions.some((p) => p.action === action &&
|
|
770
789
|
p.collection === collectionName &&
|
|
771
|
-
((p.policy?.name === user?.role
|
|
790
|
+
((p.policy?.name === user?.role?.name &&
|
|
772
791
|
(!item || evaluatePermissions(p.permissions))) ||
|
|
773
792
|
(p.policy?.name === '$t:public_label' &&
|
|
774
793
|
(layer?.public_edit_items || item?.layer?.public_edit_items) &&
|
|
@@ -777,37 +796,37 @@ function usePermissionsManager(initialPermissions) {
|
|
|
777
796
|
}, [permissions, user, adminRole]);
|
|
778
797
|
return { permissions, setPermissionApi, setPermissionData, setAdminRole, hasUserPermission };
|
|
779
798
|
}
|
|
780
|
-
const PermissionsProvider = ({ initialPermissions, children }) => (jsxRuntime.jsx(PermissionContext.Provider, { value: usePermissionsManager(initialPermissions), children: children }));
|
|
799
|
+
const PermissionsProvider = ({ initialPermissions, children, }) => (jsxRuntime.jsx(PermissionContext.Provider, { value: usePermissionsManager(initialPermissions), children: children }));
|
|
781
800
|
const useSetPermissionApi = () => {
|
|
782
|
-
const { setPermissionApi } =
|
|
801
|
+
const { setPermissionApi } = React.useContext(PermissionContext);
|
|
783
802
|
return setPermissionApi;
|
|
784
803
|
};
|
|
785
804
|
const useSetPermissionData = () => {
|
|
786
|
-
const { setPermissionData } =
|
|
805
|
+
const { setPermissionData } = React.useContext(PermissionContext);
|
|
787
806
|
return setPermissionData;
|
|
788
807
|
};
|
|
789
808
|
const useHasUserPermission = () => {
|
|
790
|
-
const { hasUserPermission } =
|
|
809
|
+
const { hasUserPermission } = React.useContext(PermissionContext);
|
|
791
810
|
return hasUserPermission;
|
|
792
811
|
};
|
|
793
812
|
const useSetAdminRole = () => {
|
|
794
|
-
const { setAdminRole } =
|
|
813
|
+
const { setAdminRole } = React.useContext(PermissionContext);
|
|
795
814
|
return setAdminRole;
|
|
796
815
|
};
|
|
797
816
|
|
|
798
|
-
const SelectPositionContext =
|
|
817
|
+
const SelectPositionContext = React.createContext({
|
|
799
818
|
selectPosition: null,
|
|
800
819
|
setSelectPosition: () => { },
|
|
801
820
|
setMarkerClicked: () => { },
|
|
802
821
|
setMapClicked: () => { },
|
|
803
822
|
});
|
|
804
823
|
function useSelectPositionManager() {
|
|
805
|
-
const [selectPosition, setSelectPosition] =
|
|
806
|
-
const [markerClicked, setMarkerClicked] =
|
|
807
|
-
const [mapClicked, setMapClicked] =
|
|
824
|
+
const [selectPosition, setSelectPosition] = React.useState(null);
|
|
825
|
+
const [markerClicked, setMarkerClicked] = React.useState();
|
|
826
|
+
const [mapClicked, setMapClicked] = React.useState();
|
|
808
827
|
const updateItem = useUpdateItem();
|
|
809
828
|
const hasUserPermission = useHasUserPermission();
|
|
810
|
-
|
|
829
|
+
React.useEffect(() => {
|
|
811
830
|
if (selectPosition &&
|
|
812
831
|
markerClicked &&
|
|
813
832
|
'text' in selectPosition &&
|
|
@@ -816,7 +835,7 @@ function useSelectPositionManager() {
|
|
|
816
835
|
}
|
|
817
836
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
818
837
|
}, [markerClicked]);
|
|
819
|
-
|
|
838
|
+
React.useEffect(() => {
|
|
820
839
|
if (selectPosition != null) {
|
|
821
840
|
if ('menuIcon' in selectPosition) {
|
|
822
841
|
mapClicked &&
|
|
@@ -914,25 +933,25 @@ function useSelectPositionManager() {
|
|
|
914
933
|
}
|
|
915
934
|
const SelectPositionProvider = ({ children }) => (jsxRuntime.jsx(SelectPositionContext.Provider, { value: useSelectPositionManager(), children: children }));
|
|
916
935
|
const useSelectPosition = () => {
|
|
917
|
-
const { selectPosition } =
|
|
936
|
+
const { selectPosition } = React.useContext(SelectPositionContext);
|
|
918
937
|
return selectPosition;
|
|
919
938
|
};
|
|
920
939
|
const useSetSelectPosition = () => {
|
|
921
|
-
const { setSelectPosition } =
|
|
940
|
+
const { setSelectPosition } = React.useContext(SelectPositionContext);
|
|
922
941
|
return setSelectPosition;
|
|
923
942
|
};
|
|
924
943
|
const useSetMarkerClicked = () => {
|
|
925
|
-
const { setMarkerClicked } =
|
|
944
|
+
const { setMarkerClicked } = React.useContext(SelectPositionContext);
|
|
926
945
|
return setMarkerClicked;
|
|
927
946
|
};
|
|
928
947
|
const useSetMapClicked = () => {
|
|
929
|
-
const { setMapClicked } =
|
|
948
|
+
const { setMapClicked } = React.useContext(SelectPositionContext);
|
|
930
949
|
return setMapClicked;
|
|
931
950
|
};
|
|
932
951
|
|
|
933
952
|
const hashTagRegex = /(#+[a-zA-Z0-9À-ÖØ-öø-ʸ_-]{1,})/g;
|
|
934
953
|
|
|
935
|
-
const TagContext =
|
|
954
|
+
const TagContext = React.createContext({
|
|
936
955
|
tags: [],
|
|
937
956
|
addTag: () => { },
|
|
938
957
|
setTagApi: () => { },
|
|
@@ -941,9 +960,9 @@ const TagContext = react.createContext({
|
|
|
941
960
|
allTagsLoaded: false,
|
|
942
961
|
});
|
|
943
962
|
function useTagsManager(initialTags) {
|
|
944
|
-
const [allTagsLoaded, setallTagsLoaded] =
|
|
945
|
-
const [tagCount, setTagCount] =
|
|
946
|
-
const [tags, dispatch] =
|
|
963
|
+
const [allTagsLoaded, setallTagsLoaded] = React.useState(false);
|
|
964
|
+
const [tagCount, setTagCount] = React.useState(0);
|
|
965
|
+
const [tags, dispatch] = React.useReducer((state, action) => {
|
|
947
966
|
switch (action.type) {
|
|
948
967
|
case 'ADD':
|
|
949
968
|
// eslint-disable-next-line no-case-declarations
|
|
@@ -960,8 +979,8 @@ function useTagsManager(initialTags) {
|
|
|
960
979
|
throw new Error();
|
|
961
980
|
}
|
|
962
981
|
}, initialTags);
|
|
963
|
-
const [api, setApi] =
|
|
964
|
-
const setTagApi =
|
|
982
|
+
const [api, setApi] = React.useState({});
|
|
983
|
+
const setTagApi = React.useCallback(async (api) => {
|
|
965
984
|
setApi(api);
|
|
966
985
|
const result = await api.getItems();
|
|
967
986
|
setTagCount(result.length);
|
|
@@ -976,7 +995,7 @@ function useTagsManager(initialTags) {
|
|
|
976
995
|
}
|
|
977
996
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
978
997
|
}, []);
|
|
979
|
-
const setTagData =
|
|
998
|
+
const setTagData = React.useCallback((data) => {
|
|
980
999
|
data.map((tag) => {
|
|
981
1000
|
// tag.name = tag.name.toLocaleLowerCase();
|
|
982
1001
|
dispatch({ type: 'ADD', tag });
|
|
@@ -992,7 +1011,7 @@ function useTagsManager(initialTags) {
|
|
|
992
1011
|
api.createItem && api.createItem(tag);
|
|
993
1012
|
}
|
|
994
1013
|
};
|
|
995
|
-
const getItemTags =
|
|
1014
|
+
const getItemTags = React.useCallback((item) => {
|
|
996
1015
|
const text = item.text;
|
|
997
1016
|
const itemTagStrings = text?.match(hashTagRegex);
|
|
998
1017
|
const itemTags = [];
|
|
@@ -1017,27 +1036,27 @@ function useTagsManager(initialTags) {
|
|
|
1017
1036
|
}
|
|
1018
1037
|
const TagsProvider = ({ initialTags, children }) => (jsxRuntime.jsx(TagContext.Provider, { value: useTagsManager(initialTags), children: children }));
|
|
1019
1038
|
const useTags = () => {
|
|
1020
|
-
const { tags } =
|
|
1039
|
+
const { tags } = React.useContext(TagContext);
|
|
1021
1040
|
return tags;
|
|
1022
1041
|
};
|
|
1023
1042
|
const useAddTag = () => {
|
|
1024
|
-
const { addTag } =
|
|
1043
|
+
const { addTag } = React.useContext(TagContext);
|
|
1025
1044
|
return addTag;
|
|
1026
1045
|
};
|
|
1027
1046
|
const useSetTagApi = () => {
|
|
1028
|
-
const { setTagApi } =
|
|
1047
|
+
const { setTagApi } = React.useContext(TagContext);
|
|
1029
1048
|
return setTagApi;
|
|
1030
1049
|
};
|
|
1031
1050
|
const useSetTagData = () => {
|
|
1032
|
-
const { setTagData } =
|
|
1051
|
+
const { setTagData } = React.useContext(TagContext);
|
|
1033
1052
|
return setTagData;
|
|
1034
1053
|
};
|
|
1035
1054
|
const useGetItemTags = () => {
|
|
1036
|
-
const { getItemTags } =
|
|
1055
|
+
const { getItemTags } = React.useContext(TagContext);
|
|
1037
1056
|
return getItemTags;
|
|
1038
1057
|
};
|
|
1039
1058
|
const useAllTagsLoaded = () => {
|
|
1040
|
-
const { allTagsLoaded } =
|
|
1059
|
+
const { allTagsLoaded } = React.useContext(TagContext);
|
|
1041
1060
|
return allTagsLoaded;
|
|
1042
1061
|
};
|
|
1043
1062
|
|
|
@@ -1045,13 +1064,13 @@ const initialAppState = {
|
|
|
1045
1064
|
assetsApi: {},
|
|
1046
1065
|
userType: '',
|
|
1047
1066
|
};
|
|
1048
|
-
const AppContext =
|
|
1067
|
+
const AppContext = React.createContext({
|
|
1049
1068
|
state: initialAppState,
|
|
1050
1069
|
setAppState: () => { },
|
|
1051
1070
|
});
|
|
1052
1071
|
function useAppManager() {
|
|
1053
|
-
const [state, setState] =
|
|
1054
|
-
const setAppState =
|
|
1072
|
+
const [state, setState] = React.useState(initialAppState);
|
|
1073
|
+
const setAppState = React.useCallback((newState) => {
|
|
1055
1074
|
setState((prevState) => ({
|
|
1056
1075
|
...prevState,
|
|
1057
1076
|
...newState,
|
|
@@ -1061,19 +1080,18 @@ function useAppManager() {
|
|
|
1061
1080
|
}
|
|
1062
1081
|
const AppStateProvider = ({ children }) => jsxRuntime.jsx(AppContext.Provider, { value: useAppManager(), children: children });
|
|
1063
1082
|
const useAppState = () => {
|
|
1064
|
-
const { state } =
|
|
1083
|
+
const { state } = React.useContext(AppContext);
|
|
1065
1084
|
return state;
|
|
1066
1085
|
};
|
|
1067
1086
|
const useSetAppState = () => {
|
|
1068
|
-
const { setAppState } =
|
|
1087
|
+
const { setAppState } = React.useContext(AppContext);
|
|
1069
1088
|
return setAppState;
|
|
1070
1089
|
};
|
|
1071
1090
|
|
|
1072
1091
|
// Helper context to determine if the ContextWrapper is already present.
|
|
1073
|
-
const ContextCheckContext =
|
|
1074
|
-
// eslint-disable-next-line react/prop-types
|
|
1092
|
+
const ContextCheckContext = React.createContext(false);
|
|
1075
1093
|
const ContextWrapper = ({ children }) => {
|
|
1076
|
-
const isWrapped =
|
|
1094
|
+
const isWrapped = React.useContext(ContextCheckContext);
|
|
1077
1095
|
// Check if we are already inside a Router
|
|
1078
1096
|
let location;
|
|
1079
1097
|
try {
|
|
@@ -1113,6 +1131,8 @@ function containsUUID(str) {
|
|
|
1113
1131
|
return uuidRegex.test(str);
|
|
1114
1132
|
}
|
|
1115
1133
|
|
|
1134
|
+
var PlusSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3Ryb2tlLXdpZHRoPSIzIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgY2xhc3M9InR3LXctNSB0dy1oLTUiPjxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZD0iTTEyIDQuNXYxNW03LjUtNy41aC0xNSI+PC9wYXRoPjwvc3ZnPg==';
|
|
1135
|
+
|
|
1116
1136
|
function AddButton({ triggerAction, }) {
|
|
1117
1137
|
const layers = useLayers();
|
|
1118
1138
|
const hasUserPermission = useHasUserPermission();
|
|
@@ -1127,7 +1147,7 @@ function AddButton({ triggerAction, }) {
|
|
|
1127
1147
|
});
|
|
1128
1148
|
return canAdd;
|
|
1129
1149
|
};
|
|
1130
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: canAddItems() ? (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-top tw-dropdown-end tw-dropdown-hover tw-z-500 tw-absolute tw-right-4 tw-bottom-4', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow tw-bg-base-100', children: jsxRuntime.jsx("
|
|
1150
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: canAddItems() ? (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-top tw-dropdown-end tw-dropdown-hover tw-z-500 tw-absolute tw-right-4 tw-bottom-4', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow tw-bg-base-100', children: jsxRuntime.jsx("img", { src: PlusSVG, alt: 'Layers', className: 'tw-h-5 tw-w-5' }) }), jsxRuntime.jsx("ul", { tabIndex: 0, className: 'tw-dropdown-content tw-pr-1 tw-list-none', children: layers.map((layer) => layer.api?.createItem &&
|
|
1131
1151
|
hasUserPermission(layer.api.collectionName, 'create', undefined, layer) &&
|
|
1132
1152
|
layer.listed && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { children: jsxRuntime.jsx("div", { className: 'tw-tooltip tw-tooltip-left', "data-tip": layer.menuText, children: jsxRuntime.jsx("button", { tabIndex: 0, className: 'tw-z-500 tw-border-0 tw-pl-2 tw-p-0 tw-mb-3 tw-w-10 tw-h-10 tw-cursor-pointer tw-rounded-full tw-mouse tw-drop-shadow-md tw-transition tw-ease-in tw-duration-200 focus:tw-outline-none', style: { backgroundColor: layer.menuColor || '#777' }, onClick: () => {
|
|
1133
1153
|
triggerAction(layer);
|
|
@@ -1138,8 +1158,8 @@ function AddButton({ triggerAction, }) {
|
|
|
1138
1158
|
}
|
|
1139
1159
|
|
|
1140
1160
|
const Control = ({ position, children, zIndex, absolute, }) => {
|
|
1141
|
-
const controlContainerRef =
|
|
1142
|
-
|
|
1161
|
+
const controlContainerRef = React.createRef();
|
|
1162
|
+
React.useEffect(() => {
|
|
1143
1163
|
if (controlContainerRef.current !== null) {
|
|
1144
1164
|
leaflet.DomEvent.disableClickPropagation(controlContainerRef.current);
|
|
1145
1165
|
leaflet.DomEvent.disableScrollPropagation(controlContainerRef.current);
|
|
@@ -1148,14 +1168,39 @@ const Control = ({ position, children, zIndex, absolute, }) => {
|
|
|
1148
1168
|
return (jsxRuntime.jsx("div", { ref: controlContainerRef, style: { zIndex }, className: `${absolute && 'tw-absolute'} tw-z-[999] tw-flex-col ${position === 'topLeft' && 'tw-top-4 tw-left-4'} ${position === 'bottomLeft' && 'tw-bottom-4 tw-left-4'} ${position === 'topRight' && 'tw-bottom-4 tw-right-4'} ${position === 'bottomRight' && 'tw-bottom-4 tw-right-4'}`, children: children }));
|
|
1149
1169
|
};
|
|
1150
1170
|
|
|
1171
|
+
function FunnelIcon({
|
|
1172
|
+
title,
|
|
1173
|
+
titleId,
|
|
1174
|
+
...props
|
|
1175
|
+
}, svgRef) {
|
|
1176
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
1177
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1178
|
+
fill: "none",
|
|
1179
|
+
viewBox: "0 0 24 24",
|
|
1180
|
+
strokeWidth: 1.5,
|
|
1181
|
+
stroke: "currentColor",
|
|
1182
|
+
"aria-hidden": "true",
|
|
1183
|
+
"data-slot": "icon",
|
|
1184
|
+
ref: svgRef,
|
|
1185
|
+
"aria-labelledby": titleId
|
|
1186
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1187
|
+
id: titleId
|
|
1188
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1189
|
+
strokeLinecap: "round",
|
|
1190
|
+
strokeLinejoin: "round",
|
|
1191
|
+
d: "M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 0 1-.659 1.591l-5.432 5.432a2.25 2.25 0 0 0-.659 1.591v2.927a2.25 2.25 0 0 1-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 0 0-.659-1.591L3.659 7.409A2.25 2.25 0 0 1 3 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0 1 12 3Z"
|
|
1192
|
+
}));
|
|
1193
|
+
}
|
|
1194
|
+
const ForwardRef$e = /*#__PURE__*/ React__namespace.forwardRef(FunnelIcon);
|
|
1195
|
+
|
|
1151
1196
|
function FilterControl() {
|
|
1152
|
-
const [open, setOpen] =
|
|
1197
|
+
const [open, setOpen] = React.useState(false);
|
|
1153
1198
|
const groupTypes = [
|
|
1154
1199
|
{ text: 'Regional Gruppe', value: 'wuerdekompass' },
|
|
1155
1200
|
{ text: 'Themen Gruppe', value: 'themenkompass' },
|
|
1156
1201
|
{ text: 'liebevoll.jetzt', value: 'liebevoll.jetzt' },
|
|
1157
1202
|
];
|
|
1158
|
-
|
|
1203
|
+
React.useEffect(() => {
|
|
1159
1204
|
groupTypes.map((layer) => addVisibleGroupType(layer.value));
|
|
1160
1205
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1161
1206
|
}, []);
|
|
@@ -1167,185 +1212,33 @@ function FilterControl() {
|
|
|
1167
1212
|
setOpen(false);
|
|
1168
1213
|
}, children: jsxRuntime.jsx("p", { className: 'tw-text-center ', children: "\u2715" }) }), jsxRuntime.jsx("ul", { className: 'tw-flex-row', children: groupTypes.map((groupType) => (jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("label", { htmlFor: groupType.value, className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-1', children: [jsxRuntime.jsx("input", { id: groupType.value, onChange: () => toggleVisibleGroupType(groupType.value), type: 'checkbox', className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: isGroupTypeVisible(groupType.value) }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2 tw-cursor-pointer', children: groupType.text })] }) }, groupType.value))) })] })) : (jsxRuntime.jsxs("div", { className: 'tw-indicator', children: [visibleGroupTypes.length < groupTypes.length && (jsxRuntime.jsx("span", { className: 'tw-indicator-item tw-badge tw-badge-success tw-h-4 tw-p-2 tw-translate-x-1/3 -tw-translate-y-1/3 tw-border-0' })), jsxRuntime.jsx("div", { className: 'tw-card-body hover:tw-bg-slate-300 tw-card tw-p-2 tw-h-10 tw-w-10 tw-transition-all tw-duration-300 hover:tw-cursor-pointer', onClick: () => {
|
|
1169
1214
|
setOpen(true);
|
|
1170
|
-
}, children: jsxRuntime.jsx(
|
|
1171
|
-
}
|
|
1172
|
-
|
|
1173
|
-
/**
|
|
1174
|
-
* @category Templates
|
|
1175
|
-
*/
|
|
1176
|
-
function MapOverlayPage({ children, className, backdrop, card = true, }) {
|
|
1177
|
-
const closeScreen = () => {
|
|
1178
|
-
navigate(`/${window.location.search ? window.location.search : ''}`);
|
|
1179
|
-
};
|
|
1180
|
-
const navigate = reactRouterDom.useNavigate();
|
|
1181
|
-
const overlayRef = react.createRef();
|
|
1182
|
-
const backdropRef = react.createRef();
|
|
1183
|
-
react.useEffect(() => {
|
|
1184
|
-
if (overlayRef.current !== null) {
|
|
1185
|
-
leaflet.DomEvent.disableClickPropagation(overlayRef.current);
|
|
1186
|
-
leaflet.DomEvent.disableScrollPropagation(overlayRef.current);
|
|
1187
|
-
}
|
|
1188
|
-
if (backdropRef.current !== null && backdrop) {
|
|
1189
|
-
leaflet.DomEvent.disableClickPropagation(backdropRef.current);
|
|
1190
|
-
leaflet.DomEvent.disableScrollPropagation(backdropRef.current);
|
|
1191
|
-
}
|
|
1192
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1193
|
-
}, [overlayRef, backdropRef]);
|
|
1194
|
-
return (jsxRuntime.jsx("div", { className: `tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop && 'tw-z-[2000]'}`, children: jsxRuntime.jsx("div", { ref: backdropRef, className: `${backdrop && 'tw-backdrop-brightness-75'} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`, children: jsxRuntime.jsxs("div", { ref: overlayRef, className: `${card && 'tw-card tw-card-body'} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && 'tw-z-[2000]'} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`, children: [children, jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2', onClick: () => closeScreen(), children: "\u2715" })] }) }) }));
|
|
1195
|
-
}
|
|
1196
|
-
|
|
1197
|
-
/**
|
|
1198
|
-
* @category Auth
|
|
1199
|
-
*/
|
|
1200
|
-
function LoginPage() {
|
|
1201
|
-
const [email, setEmail] = react.useState('');
|
|
1202
|
-
const [password, setPassword] = react.useState('');
|
|
1203
|
-
const { login, loading } = useAuth();
|
|
1204
|
-
const navigate = reactRouterDom.useNavigate();
|
|
1205
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1206
|
-
const onLogin = async () => {
|
|
1207
|
-
await reactToastify.toast.promise(login({ email, password }), {
|
|
1208
|
-
success: {
|
|
1209
|
-
render({ data }) {
|
|
1210
|
-
navigate('/');
|
|
1211
|
-
return `Hi ${data?.first_name}`;
|
|
1212
|
-
},
|
|
1213
|
-
// other options
|
|
1214
|
-
icon: '✌️',
|
|
1215
|
-
},
|
|
1216
|
-
error: {
|
|
1217
|
-
render({ data }) {
|
|
1218
|
-
return `${data}`;
|
|
1219
|
-
},
|
|
1220
|
-
autoClose: 10000,
|
|
1221
|
-
},
|
|
1222
|
-
pending: 'logging in ...',
|
|
1223
|
-
});
|
|
1224
|
-
};
|
|
1225
|
-
react.useEffect(() => {
|
|
1226
|
-
const keyDownHandler = (event) => {
|
|
1227
|
-
if (event.key === 'Enter') {
|
|
1228
|
-
event.preventDefault();
|
|
1229
|
-
onLogin();
|
|
1230
|
-
}
|
|
1231
|
-
};
|
|
1232
|
-
document.addEventListener('keydown', keyDownHandler);
|
|
1233
|
-
return () => {
|
|
1234
|
-
document.removeEventListener('keydown', keyDownHandler);
|
|
1235
|
-
};
|
|
1236
|
-
}, [onLogin]);
|
|
1237
|
-
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Login" }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-text-right tw-text-primary', children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/reset-password', children: jsxRuntime.jsx("span", { className: 'tw-text-sm tw-inline-block hover:tw-text-primary hover:tw-underline hover:tw-cursor-pointer tw-transition tw-duration-200', children: "Forgot Password?" }) }) }), jsxRuntime.jsx("div", { className: 'tw-card-actions', children: jsxRuntime.jsx("button", { className: loading
|
|
1238
|
-
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
1239
|
-
: 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onLogin(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Login' }) })] }));
|
|
1240
|
-
}
|
|
1241
|
-
|
|
1242
|
-
/**
|
|
1243
|
-
* @category Auth
|
|
1244
|
-
*/
|
|
1245
|
-
function SignupPage() {
|
|
1246
|
-
const [email, setEmail] = react.useState('');
|
|
1247
|
-
const [userName, setUserName] = react.useState('');
|
|
1248
|
-
const [password, setPassword] = react.useState('');
|
|
1249
|
-
const { register, loading } = useAuth();
|
|
1250
|
-
const navigate = reactRouterDom.useNavigate();
|
|
1251
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1252
|
-
const onRegister = async () => {
|
|
1253
|
-
await reactToastify.toast.promise(register({ email, password }, userName), {
|
|
1254
|
-
success: {
|
|
1255
|
-
render({ data }) {
|
|
1256
|
-
navigate('/');
|
|
1257
|
-
return `Hi ${data?.first_name}`;
|
|
1258
|
-
},
|
|
1259
|
-
// other options
|
|
1260
|
-
icon: '✌️',
|
|
1261
|
-
},
|
|
1262
|
-
error: {
|
|
1263
|
-
render({ data }) {
|
|
1264
|
-
return `${data}`;
|
|
1265
|
-
},
|
|
1266
|
-
autoClose: 10000,
|
|
1267
|
-
},
|
|
1268
|
-
pending: 'creating new user ...',
|
|
1269
|
-
});
|
|
1270
|
-
};
|
|
1271
|
-
react.useEffect(() => {
|
|
1272
|
-
const keyDownHandler = (event) => {
|
|
1273
|
-
if (event.key === 'Enter') {
|
|
1274
|
-
event.preventDefault();
|
|
1275
|
-
onRegister();
|
|
1276
|
-
}
|
|
1277
|
-
};
|
|
1278
|
-
document.addEventListener('keydown', keyDownHandler);
|
|
1279
|
-
return () => {
|
|
1280
|
-
document.removeEventListener('keydown', keyDownHandler);
|
|
1281
|
-
};
|
|
1282
|
-
}, [onRegister]);
|
|
1283
|
-
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Sign Up" }), jsxRuntime.jsx("input", { type: 'text', placeholder: 'Name', value: userName, onChange: (e) => setUserName(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
1284
|
-
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
1285
|
-
: 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onRegister(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Sign Up' }) })] }));
|
|
1215
|
+
}, children: jsxRuntime.jsx(ForwardRef$e, { className: 'size-6 tw-stroke-[2.5]' }) })] })) }));
|
|
1286
1216
|
}
|
|
1287
1217
|
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
},
|
|
1311
|
-
pending: 'sending email ...',
|
|
1312
|
-
});
|
|
1313
|
-
};
|
|
1314
|
-
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Reset Password" }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
1315
|
-
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
1316
|
-
: 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onReset(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Send' }) })] }));
|
|
1317
|
-
}
|
|
1318
|
-
|
|
1319
|
-
/**
|
|
1320
|
-
* @category Auth
|
|
1321
|
-
*/
|
|
1322
|
-
function SetNewPasswordPage() {
|
|
1323
|
-
const [password, setPassword] = react.useState('');
|
|
1324
|
-
const { passwordReset, loading } = useAuth();
|
|
1325
|
-
const navigate = reactRouterDom.useNavigate();
|
|
1326
|
-
const onReset = async () => {
|
|
1327
|
-
const token = window.location.search.split('token=')[1];
|
|
1328
|
-
// eslint-disable-next-line no-console
|
|
1329
|
-
console.log(token);
|
|
1330
|
-
await reactToastify.toast.promise(passwordReset(token, password), {
|
|
1331
|
-
success: {
|
|
1332
|
-
render() {
|
|
1333
|
-
navigate('/');
|
|
1334
|
-
return 'New password set';
|
|
1335
|
-
},
|
|
1336
|
-
},
|
|
1337
|
-
error: {
|
|
1338
|
-
render({ data }) {
|
|
1339
|
-
return `${data}`;
|
|
1340
|
-
},
|
|
1341
|
-
},
|
|
1342
|
-
pending: 'setting password ...',
|
|
1343
|
-
});
|
|
1344
|
-
};
|
|
1345
|
-
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Set new Password" }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
1346
|
-
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
1347
|
-
: 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onReset(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Set' }) })] }));
|
|
1218
|
+
function HeartIcon({
|
|
1219
|
+
title,
|
|
1220
|
+
titleId,
|
|
1221
|
+
...props
|
|
1222
|
+
}, svgRef) {
|
|
1223
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
1224
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1225
|
+
fill: "none",
|
|
1226
|
+
viewBox: "0 0 24 24",
|
|
1227
|
+
strokeWidth: 1.5,
|
|
1228
|
+
stroke: "currentColor",
|
|
1229
|
+
"aria-hidden": "true",
|
|
1230
|
+
"data-slot": "icon",
|
|
1231
|
+
ref: svgRef,
|
|
1232
|
+
"aria-labelledby": titleId
|
|
1233
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1234
|
+
id: titleId
|
|
1235
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1236
|
+
strokeLinecap: "round",
|
|
1237
|
+
strokeLinejoin: "round",
|
|
1238
|
+
d: "M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z"
|
|
1239
|
+
}));
|
|
1348
1240
|
}
|
|
1241
|
+
const ForwardRef$d = /*#__PURE__*/ React__namespace.forwardRef(HeartIcon);
|
|
1349
1242
|
|
|
1350
1243
|
const GratitudeControl = () => {
|
|
1351
1244
|
const navigate = reactRouterDom.useNavigate();
|
|
@@ -1353,14 +1246,16 @@ const GratitudeControl = () => {
|
|
|
1353
1246
|
if (isAuthenticated) {
|
|
1354
1247
|
return (jsxRuntime.jsx("div", { className: 'tw-card tw-bg-base-100 tw-shadow-xl tw-mt-2 tw-w-fit', children: jsxRuntime.jsx("div", { className: 'tw-card-body hover:tw-bg-slate-300 tw-card tw-p-2 tw-h-10 tw-w-10 tw-transition-all tw-duration-300 hover:tw-cursor-pointer', onClick: () => {
|
|
1355
1248
|
navigate('/select-user');
|
|
1356
|
-
}, children: jsxRuntime.jsx(
|
|
1249
|
+
}, children: jsxRuntime.jsx(ForwardRef$d, { className: 'tw-stroke-[2.5]' }) }) }));
|
|
1357
1250
|
}
|
|
1358
1251
|
else
|
|
1359
1252
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
1360
1253
|
};
|
|
1361
1254
|
|
|
1255
|
+
var LayerSVG = 'data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPScxLjEnIHZpZXdCb3g9JzAgMCAyMCAyMCcgc3Ryb2tlLXdpZHRoPSIyIiB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnPgogICAgPHBhdGgKICAgICAgICBpZD0nc3ZnXzEnCiAgICAgICAgZmlsbD0nY3VycmVudENvbG9yJwogICAgICAgIGQ9J20yLjc1NTY1LDExLjkwNzI3bC0xLjAzODUyLDAuMjgzNzJjLTAuNzc3MTgsMC4zODg1OSAtMC43NzcxOCwxLjAxMzggMCwxLjQwMjNsNy4wMTU2LDMuNTA3OGMwLjc3NzE4LDAuMzg4NTkgMi4wMjc1LDAuMzg4NTkgMi44MDQ3LDBsNy4wMTU2LC0zLjUwNzhjMC43NzcxOCwtMC4zODg1OSAwLjc3NzE4LC0xLjAxMzggMCwtMS40MDIzbC0wLjYzMzExLC0wLjQ4NjQzbC00LjY3NzE4LDIuMjM2MjRjLTEuNTQ1MiwwLjc3MjYyIC0zLjMxODc3LDEuNTgzNDMgLTQuODY0MDcsMC44MTA4MWwtNS42MjMwMiwtMi44NDQzNHonCiAgICAvPgogICAgPHBhdGgKICAgICAgICBpZD0nc3ZnXzInCiAgICAgICAgc3Ryb2tlPSdjdXJyZW50Q29sb3InCiAgICAgICAgZmlsbD0nbm9uZScKICAgICAgICBkPSdtMTEuMjQ3LDQuMzA4NTFsNi4yMzQ5LDMuMDg3N2MwLjY5MDgzLDAuMzQyMTEgMC42OTA4MywwLjg5Mjk1IDAsMS4yMzUxbC02LjIzNDksMy4wODc3Yy0wLjY5MDgzLDAuMzQyMTEgLTEuODAzMSwwLjM0MjEyIC0yLjQ5NCwwbC02LjIzNDksLTMuMDg3N2MtMC42OTA4MywtMC4zNDIxMSAtMC42OTA4MywtMC44OTI5NSAwLC0xLjIzNTFsNi4yMzQ5LC0zLjA4NzdjMC42OTA4MywtMC4zNDIxMSAxLjgwMzEsLTAuMzQyMTEgMi40OTQsMHonCiAgICAvPgo8L3N2Zz4=';
|
|
1256
|
+
|
|
1362
1257
|
function LayerControl() {
|
|
1363
|
-
const [open, setOpen] =
|
|
1258
|
+
const [open, setOpen] = React.useState(false);
|
|
1364
1259
|
const layers = useLayers();
|
|
1365
1260
|
const isLayerVisible = useIsLayerVisible();
|
|
1366
1261
|
const toggleVisibleLayer = useToggleVisibleLayer();
|
|
@@ -1368,43 +1263,92 @@ function LayerControl() {
|
|
|
1368
1263
|
setOpen(false);
|
|
1369
1264
|
}, children: jsxRuntime.jsx("p", { className: 'tw-text-center ', children: "\u2715" }) }), jsxRuntime.jsx("ul", { className: 'tw-flex-row', children: layers.map((layer) => layer.listed && (jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("label", { htmlFor: layer.name, className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-1', children: [jsxRuntime.jsx("input", { id: layer.name, onChange: () => toggleVisibleLayer(layer), type: 'checkbox', className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: isLayerVisible(layer) }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2 tw-cursor-pointer', children: layer.name })] }) }, layer.name))) })] })) : (jsxRuntime.jsx("div", { className: 'tw-card-body hover:tw-bg-slate-300 tw-card tw-p-2 tw-h-10 tw-w-10 tw-transition-all tw-duration-300 hover:tw-cursor-pointer', onClick: () => {
|
|
1370
1265
|
setOpen(true);
|
|
1371
|
-
}, children: jsxRuntime.
|
|
1266
|
+
}, children: jsxRuntime.jsx("img", { src: LayerSVG, alt: 'Layers' }) })) }));
|
|
1372
1267
|
}
|
|
1373
1268
|
|
|
1269
|
+
function FlagIcon({
|
|
1270
|
+
title,
|
|
1271
|
+
titleId,
|
|
1272
|
+
...props
|
|
1273
|
+
}, svgRef) {
|
|
1274
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
1275
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1276
|
+
fill: "none",
|
|
1277
|
+
viewBox: "0 0 24 24",
|
|
1278
|
+
strokeWidth: 1.5,
|
|
1279
|
+
stroke: "currentColor",
|
|
1280
|
+
"aria-hidden": "true",
|
|
1281
|
+
"data-slot": "icon",
|
|
1282
|
+
ref: svgRef,
|
|
1283
|
+
"aria-labelledby": titleId
|
|
1284
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1285
|
+
id: titleId
|
|
1286
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1287
|
+
strokeLinecap: "round",
|
|
1288
|
+
strokeLinejoin: "round",
|
|
1289
|
+
d: "M3 3v1.5M3 21v-6m0 0 2.77-.693a9 9 0 0 1 6.208.682l.108.054a9 9 0 0 0 6.086.71l3.114-.732a48.524 48.524 0 0 1-.005-10.499l-3.11.732a9 9 0 0 1-6.085-.711l-.108-.054a9 9 0 0 0-6.208-.682L3 4.5M3 15V4.5"
|
|
1290
|
+
}));
|
|
1291
|
+
}
|
|
1292
|
+
const ForwardRef$c = /*#__PURE__*/ React__namespace.forwardRef(FlagIcon);
|
|
1293
|
+
|
|
1294
|
+
function MagnifyingGlassIcon({
|
|
1295
|
+
title,
|
|
1296
|
+
titleId,
|
|
1297
|
+
...props
|
|
1298
|
+
}, svgRef) {
|
|
1299
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
1300
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1301
|
+
fill: "none",
|
|
1302
|
+
viewBox: "0 0 24 24",
|
|
1303
|
+
strokeWidth: 1.5,
|
|
1304
|
+
stroke: "currentColor",
|
|
1305
|
+
"aria-hidden": "true",
|
|
1306
|
+
"data-slot": "icon",
|
|
1307
|
+
ref: svgRef,
|
|
1308
|
+
"aria-labelledby": titleId
|
|
1309
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1310
|
+
id: titleId
|
|
1311
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1312
|
+
strokeLinecap: "round",
|
|
1313
|
+
strokeLinejoin: "round",
|
|
1314
|
+
d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"
|
|
1315
|
+
}));
|
|
1316
|
+
}
|
|
1317
|
+
const ForwardRef$b = /*#__PURE__*/ React__namespace.forwardRef(MagnifyingGlassIcon);
|
|
1318
|
+
|
|
1374
1319
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
1375
1320
|
/* eslint-disable @typescript-eslint/no-unsafe-argument */
|
|
1376
1321
|
/* eslint-disable @typescript-eslint/no-unsafe-return */
|
|
1377
1322
|
/* eslint-disable @typescript-eslint/no-unsafe-call */
|
|
1378
1323
|
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
1379
1324
|
const useTimeout = (callback, delay) => {
|
|
1380
|
-
const callbackRef =
|
|
1381
|
-
const timeoutRef =
|
|
1382
|
-
|
|
1325
|
+
const callbackRef = React.useRef(callback);
|
|
1326
|
+
const timeoutRef = React.useRef();
|
|
1327
|
+
React.useEffect(() => {
|
|
1383
1328
|
callbackRef.current = callback;
|
|
1384
1329
|
}, [callback]);
|
|
1385
|
-
const set =
|
|
1330
|
+
const set = React.useCallback(() => {
|
|
1386
1331
|
timeoutRef.current = setTimeout(() => callbackRef.current(), delay);
|
|
1387
1332
|
}, [delay]);
|
|
1388
|
-
const clear =
|
|
1333
|
+
const clear = React.useCallback(() => {
|
|
1389
1334
|
timeoutRef.current && clearTimeout(timeoutRef.current);
|
|
1390
1335
|
}, []);
|
|
1391
|
-
|
|
1336
|
+
React.useEffect(() => {
|
|
1392
1337
|
set();
|
|
1393
1338
|
return clear;
|
|
1394
1339
|
}, [delay, set, clear]);
|
|
1395
|
-
const reset =
|
|
1340
|
+
const reset = React.useCallback(() => {
|
|
1396
1341
|
clear();
|
|
1397
1342
|
set();
|
|
1398
1343
|
}, [clear, set]);
|
|
1399
1344
|
return { reset, clear };
|
|
1400
1345
|
};
|
|
1401
1346
|
|
|
1402
|
-
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
1403
1347
|
const useDebounce = (callback, delay, deps) => {
|
|
1404
1348
|
const { reset, clear } = useTimeout(callback, delay);
|
|
1405
|
-
|
|
1349
|
+
React.useEffect(reset, [...deps, reset]);
|
|
1406
1350
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1407
|
-
|
|
1351
|
+
React.useEffect(clear, []);
|
|
1408
1352
|
};
|
|
1409
1353
|
|
|
1410
1354
|
function decodeTag(string) {
|
|
@@ -1496,6 +1440,8 @@ const MarkerIconFactory = (shape, color1, color2, icon) => {
|
|
|
1496
1440
|
});
|
|
1497
1441
|
};
|
|
1498
1442
|
|
|
1443
|
+
var TargetSVG = 'data:image/svg+xml;base64,PHN2ZwogICAgZmlsbD0nY3VycmVudENvbG9yJwogICAgdmlld0JveD0nMCAwIDMyIDMyJwogICAgdmVyc2lvbj0nMS4xJwogICAgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJwo+CiAgPHBhdGggZD0nTTMwIDE0Ljc1aC0yLjgyNGMtMC42MDgtNS4yMTktNC43MDctOS4zMTgtOS44NzQtOS45MjFsLTAuMDUzLTAuMDA1di0yLjgyNGMwLTAuNjktMC41Ni0xLjI1LTEuMjUtMS4yNXMtMS4yNSAwLjU2LTEuMjUgMS4yNXYwIDIuODI0Yy01LjIxOSAwLjYwOC05LjMxOCA0LjcwNy05LjkyMSA5Ljg3NGwtMC4wMDUgMC4wNTNoLTIuODI0Yy0wLjY5IDAtMS4yNSAwLjU2LTEuMjUgMS4yNXMwLjU2IDEuMjUgMS4yNSAxLjI1djBoMi44MjRjMC42MDggNS4yMTkgNC43MDcgOS4zMTggOS44NzQgOS45MjFsMC4wNTMgMC4wMDV2Mi44MjRjMCAwLjY5IDAuNTYgMS4yNSAxLjI1IDEuMjVzMS4yNS0wLjU2IDEuMjUtMS4yNXYwLTIuODI0YzUuMjE5LTAuNjA4IDkuMzE4LTQuNzA3IDkuOTIxLTkuODc0bDAuMDA1LTAuMDUzaDIuODI0YzAuNjkgMCAxLjI1LTAuNTYgMS4yNS0xLjI1cy0wLjU2LTEuMjUtMS4yNS0xLjI1djB6TTE3LjI1IDI0LjYyNHYtMi42MjRjMC0wLjY5LTAuNTYtMS4yNS0xLjI1LTEuMjVzLTEuMjUgMC41Ni0xLjI1IDEuMjV2MCAyLjYyNGMtMy44MjEtMC41Ny02LjgwMy0zLjU1My03LjM2OC03LjMyNmwtMC4wMDYtMC4wNDhoMi42MjRjMC42OSAwIDEuMjUtMC41NiAxLjI1LTEuMjVzLTAuNTYtMS4yNS0xLjI1LTEuMjV2MGgtMi42MjRjMC41Ny0zLjgyMSAzLjU1My02LjgwNCA3LjMyNi03LjM2OGwwLjA0OC0wLjAwNnYyLjYyNGMwIDAuNjkgMC41NiAxLjI1IDEuMjUgMS4yNXMxLjI1LTAuNTYgMS4yNS0xLjI1djAtMi42MjRjMy44MjEgMC41NyA2LjgwMyAzLjU1MyA3LjM2OCA3LjMyNmwwLjAwNiAwLjA0OGgtMi42MjRjLTAuNjkgMC0xLjI1IDAuNTYtMS4yNSAxLjI1czAuNTYgMS4yNSAxLjI1IDEuMjV2MGgyLjYyNGMtMC41NzEgMy44MjEtMy41NTMgNi44MDMtNy4zMjYgNy4zNjhsLTAuMDQ4IDAuMDA2eic+PC9wYXRoPgo8L3N2Zz4=';
|
|
1444
|
+
|
|
1499
1445
|
/*!
|
|
1500
1446
|
Copyright (c) 2016 Dominik Moritz
|
|
1501
1447
|
|
|
@@ -2448,11 +2394,11 @@ You can find the project at: https://github.com/domoritz/leaflet-locatecontrol
|
|
|
2448
2394
|
const LocateControl = () => {
|
|
2449
2395
|
const map = reactLeaflet.useMap();
|
|
2450
2396
|
// prevent react18 from calling useEffect twice
|
|
2451
|
-
const init =
|
|
2452
|
-
const [lc, setLc] =
|
|
2453
|
-
const [active, setActive] =
|
|
2454
|
-
const [loading, setLoading] =
|
|
2455
|
-
|
|
2397
|
+
const init = React.useRef(false);
|
|
2398
|
+
const [lc, setLc] = React.useState(null);
|
|
2399
|
+
const [active, setActive] = React.useState(false);
|
|
2400
|
+
const [loading, setLoading] = React.useState(false);
|
|
2401
|
+
React.useEffect(() => {
|
|
2456
2402
|
if (!init.current) {
|
|
2457
2403
|
// @ts-ignore
|
|
2458
2404
|
setLc(leaflet.control.locate().addTo(map));
|
|
@@ -2475,22 +2421,45 @@ const LocateControl = () => {
|
|
|
2475
2421
|
lc.start();
|
|
2476
2422
|
setLoading(true);
|
|
2477
2423
|
}
|
|
2478
|
-
}, children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-md tw-mt-1' })) : (jsxRuntime.jsx("
|
|
2424
|
+
}, children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-md tw-mt-1' })) : (jsxRuntime.jsx("img", { src: TargetSVG, alt: 'x', className: 'tw-mt-1 tw-p-[1px]', style: { fill: `${active ? '#fc8702' : 'currentColor'}` } })) }) }) }));
|
|
2479
2425
|
};
|
|
2480
2426
|
|
|
2427
|
+
function Bars3Icon({
|
|
2428
|
+
title,
|
|
2429
|
+
titleId,
|
|
2430
|
+
...props
|
|
2431
|
+
}, svgRef) {
|
|
2432
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
2433
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2434
|
+
viewBox: "0 0 16 16",
|
|
2435
|
+
fill: "currentColor",
|
|
2436
|
+
"aria-hidden": "true",
|
|
2437
|
+
"data-slot": "icon",
|
|
2438
|
+
ref: svgRef,
|
|
2439
|
+
"aria-labelledby": titleId
|
|
2440
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
2441
|
+
id: titleId
|
|
2442
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
2443
|
+
fillRule: "evenodd",
|
|
2444
|
+
d: "M2 3.75A.75.75 0 0 1 2.75 3h10.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 3.75ZM2 8a.75.75 0 0 1 .75-.75h10.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 8Zm0 4.25a.75.75 0 0 1 .75-.75h10.5a.75.75 0 0 1 0 1.5H2.75a.75.75 0 0 1-.75-.75Z",
|
|
2445
|
+
clipRule: "evenodd"
|
|
2446
|
+
}));
|
|
2447
|
+
}
|
|
2448
|
+
const ForwardRef$a = /*#__PURE__*/ React__namespace.forwardRef(Bars3Icon);
|
|
2449
|
+
|
|
2481
2450
|
// Converts leaflet.locatecontrol to a React Component
|
|
2482
2451
|
const SidebarControl = () => {
|
|
2483
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { className: 'tw-card tw-bg-base-100 tw-shadow-xl tw-items-center tw-justify-center hover:tw-bg-slate-300 hover:tw-cursor-pointer tw-transition-all tw-duration-300 tw-mr-2 tw-h-12 tw-w-12 ', children: jsxRuntime.jsx("div", { className: 'tw-card-body tw-card tw-p-0', children: jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-square tw-btn-ghost tw-rounded-2xl', "data-te-sidenav-toggle-ref": true, "data-te-target": '#sidenav', "aria-controls": '#sidenav', "aria-haspopup": 'true', children: jsxRuntime.jsx(
|
|
2452
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { className: 'tw-card tw-bg-base-100 tw-shadow-xl tw-items-center tw-justify-center hover:tw-bg-slate-300 hover:tw-cursor-pointer tw-transition-all tw-duration-300 tw-mr-2 tw-h-12 tw-w-12 ', children: jsxRuntime.jsx("div", { className: 'tw-card-body tw-card tw-p-0', children: jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-square tw-btn-ghost tw-rounded-2xl', "data-te-sidenav-toggle-ref": true, "data-te-target": '#sidenav', "aria-controls": '#sidenav', "aria-haspopup": 'true', children: jsxRuntime.jsx(ForwardRef$a, { className: 'tw-inline-block tw-w-5 tw-h-5' }) }) }) }) }));
|
|
2484
2453
|
};
|
|
2485
2454
|
|
|
2486
2455
|
const SearchControl = () => {
|
|
2487
2456
|
const windowDimensions = useWindowDimensions();
|
|
2488
|
-
const [popupOpen, setPopupOpen] =
|
|
2489
|
-
const [value, setValue] =
|
|
2490
|
-
const [geoResults, setGeoResults] =
|
|
2491
|
-
const [tagsResults, setTagsResults] =
|
|
2492
|
-
const [itemsResults, setItemsResults] =
|
|
2493
|
-
const [hideSuggestions, setHideSuggestions] =
|
|
2457
|
+
const [popupOpen, setPopupOpen] = React.useState(false);
|
|
2458
|
+
const [value, setValue] = React.useState('');
|
|
2459
|
+
const [geoResults, setGeoResults] = React.useState([]);
|
|
2460
|
+
const [tagsResults, setTagsResults] = React.useState([]);
|
|
2461
|
+
const [itemsResults, setItemsResults] = React.useState([]);
|
|
2462
|
+
const [hideSuggestions, setHideSuggestions] = React.useState(true);
|
|
2494
2463
|
const map = reactLeaflet.useMap();
|
|
2495
2464
|
const tags = useTags();
|
|
2496
2465
|
const items = useItems();
|
|
@@ -2533,10 +2502,10 @@ const SearchControl = () => {
|
|
|
2533
2502
|
setHideSuggestions(true);
|
|
2534
2503
|
}, 200);
|
|
2535
2504
|
};
|
|
2536
|
-
const searchInput =
|
|
2537
|
-
const [embedded, setEmbedded] =
|
|
2505
|
+
const searchInput = React.useRef(null);
|
|
2506
|
+
const [embedded, setEmbedded] = React.useState(true);
|
|
2538
2507
|
const location = reactRouterDom.useLocation();
|
|
2539
|
-
|
|
2508
|
+
React.useEffect(() => {
|
|
2540
2509
|
const params = new URLSearchParams(location.search);
|
|
2541
2510
|
const embedded = params.get('embedded');
|
|
2542
2511
|
embedded !== 'true' && setEmbedded(false);
|
|
@@ -2579,7 +2548,7 @@ const SearchControl = () => {
|
|
|
2579
2548
|
else
|
|
2580
2549
|
map.setView(new leaflet.LatLng(geo.geometry.coordinates[1], geo.geometry.coordinates[0]), 15, { duration: 1 });
|
|
2581
2550
|
hide();
|
|
2582
|
-
}, children: [jsxRuntime.jsx(
|
|
2551
|
+
}, children: [jsxRuntime.jsx(ForwardRef$b, { className: 'tw-text-current tw-mr-2 tw-mt-0 tw-w-4' }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: 'tw-text-sm tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-max-w-[17rem]', children: geo?.properties.name ? geo?.properties.name : value }), jsxRuntime.jsxs("div", { className: 'tw-text-xs tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-max-w-[17rem]', children: [geo?.properties?.city && `${capitalizeFirstLetter(geo?.properties?.city)}, `, ' ', geo?.properties?.osm_value &&
|
|
2583
2552
|
geo?.properties?.osm_value !== 'yes' &&
|
|
2584
2553
|
geo?.properties?.osm_value !== 'primary' &&
|
|
2585
2554
|
geo?.properties?.osm_value !== 'path' &&
|
|
@@ -2598,7 +2567,7 @@ const SearchControl = () => {
|
|
|
2598
2567
|
console.log(e.target.remove());
|
|
2599
2568
|
});
|
|
2600
2569
|
map.setView(new leaflet.LatLng(extractCoordinates(value)[0], extractCoordinates(value)[1]), 15, { duration: 1 });
|
|
2601
|
-
}, children: [jsxRuntime.jsx(
|
|
2570
|
+
}, children: [jsxRuntime.jsx(ForwardRef$c, { className: 'tw-text-current tw-mr-2 tw-mt-0 tw-w-4' }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: 'tw-text-sm tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-max-w-[17rem]', children: value }), jsxRuntime.jsx("div", { className: 'tw-text-xs tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-max-w-[17rem]', children: 'Coordiante' })] })] }))] }))] })) }));
|
|
2602
2571
|
};
|
|
2603
2572
|
function isGeoCoordinate(input) {
|
|
2604
2573
|
const geokoordinatenRegex =
|
|
@@ -2717,7 +2686,7 @@ const TextView = ({ item, itemId, text, truncate = false, rawText, itemTextField
|
|
|
2717
2686
|
}, children: decodeTag(children) }, tag ? tag.name + itemId : itemId));
|
|
2718
2687
|
};
|
|
2719
2688
|
// eslint-disable-next-line react/display-name
|
|
2720
|
-
const MemoizedVideoEmbed =
|
|
2689
|
+
const MemoizedVideoEmbed = React.memo(({ url }) => (jsxRuntime.jsx("iframe", { className: 'tw-w-full', src: url, allow: 'fullscreen; picture-in-picture', allowFullScreen: true })));
|
|
2721
2690
|
return (jsxRuntime.jsx(Markdown, { className: 'tw-text-map tw-leading-map tw-text-sm', remarkPlugins: [remarkBreaks], components: {
|
|
2722
2691
|
p: CustomParagraph,
|
|
2723
2692
|
a: ({ href, children }) => {
|
|
@@ -2801,18 +2770,18 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
|
|
|
2801
2770
|
const setClusterRef = useSetClusterRef();
|
|
2802
2771
|
const clusterRef = useClusterRef();
|
|
2803
2772
|
const setMapClicked = useSetMapClicked();
|
|
2804
|
-
const [itemFormPopup, setItemFormPopup] =
|
|
2773
|
+
const [itemFormPopup, setItemFormPopup] = React.useState(null);
|
|
2805
2774
|
const layers = useLayers();
|
|
2806
2775
|
const addVisibleLayer = useAddVisibleLayer();
|
|
2807
2776
|
const leafletRefs = useLeafletRefs();
|
|
2808
2777
|
const location = reactRouterDom.useLocation();
|
|
2809
2778
|
const map = reactLeaflet.useMap();
|
|
2810
|
-
|
|
2779
|
+
React.useEffect(() => {
|
|
2811
2780
|
layers.forEach((layer) => addVisibleLayer(layer));
|
|
2812
2781
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2813
2782
|
}, [layers]);
|
|
2814
|
-
const init =
|
|
2815
|
-
|
|
2783
|
+
const init = React.useRef(false);
|
|
2784
|
+
React.useEffect(() => {
|
|
2816
2785
|
if (!init.current) {
|
|
2817
2786
|
donationWidget &&
|
|
2818
2787
|
setTimeout(() => {
|
|
@@ -2880,7 +2849,7 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
|
|
|
2880
2849
|
}
|
|
2881
2850
|
}
|
|
2882
2851
|
};
|
|
2883
|
-
|
|
2852
|
+
React.useEffect(() => {
|
|
2884
2853
|
openPopup();
|
|
2885
2854
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2886
2855
|
}, [leafletRefs, location]);
|
|
@@ -2900,8 +2869,8 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
|
|
|
2900
2869
|
layer.bindPopup(feature.properties.name);
|
|
2901
2870
|
}
|
|
2902
2871
|
};
|
|
2903
|
-
return (jsxRuntime.jsxs("div", { className: `tw-h-full ${selectNewItemPosition != null ? 'crosshair-cursor-enabled' : undefined}`, children: [jsxRuntime.jsx(reactRouterDom.Outlet, {}), jsxRuntime.jsxs(Control, { position: 'topLeft', zIndex: '1000', absolute: true, children: [jsxRuntime.jsx(SearchControl, {}), jsxRuntime.jsx(TagsControl, {})] }), jsxRuntime.jsxs(Control, { position: 'bottomLeft', zIndex: '999', absolute: true, children: [showFilterControl && jsxRuntime.jsx(FilterControl, {}), showLayerControl && jsxRuntime.jsx(LayerControl, {}), showGratitudeControl && jsxRuntime.jsx(GratitudeControl, {})] }), jsxRuntime.jsx(reactLeaflet.TileLayer, { maxZoom: 19, attribution: '\u00A9 <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', url: 'https://tile.osmand.net/hd/{z}/{x}/{y}.png' }), jsxRuntime.jsx(MarkerClusterGroup, { ref: (r) => setClusterRef(r), showCoverageOnHover: true, chunkedLoading: true, maxClusterRadius: 50, removeOutsideVisibleBounds: false, children:
|
|
2904
|
-
?
|
|
2872
|
+
return (jsxRuntime.jsxs("div", { className: `tw-h-full ${selectNewItemPosition != null ? 'crosshair-cursor-enabled' : undefined}`, children: [jsxRuntime.jsx(reactRouterDom.Outlet, {}), jsxRuntime.jsxs(Control, { position: 'topLeft', zIndex: '1000', absolute: true, children: [jsxRuntime.jsx(SearchControl, {}), jsxRuntime.jsx(TagsControl, {})] }), jsxRuntime.jsxs(Control, { position: 'bottomLeft', zIndex: '999', absolute: true, children: [showFilterControl && jsxRuntime.jsx(FilterControl, {}), showLayerControl && jsxRuntime.jsx(LayerControl, {}), showGratitudeControl && jsxRuntime.jsx(GratitudeControl, {})] }), jsxRuntime.jsx(reactLeaflet.TileLayer, { maxZoom: 19, attribution: '\u00A9 <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', url: 'https://tile.osmand.net/hd/{z}/{x}/{y}.png' }), jsxRuntime.jsx(MarkerClusterGroup, { ref: (r) => setClusterRef(r), showCoverageOnHover: true, chunkedLoading: true, maxClusterRadius: 50, removeOutsideVisibleBounds: false, children: React.Children.toArray(children).map((child) => React.isValidElement(child)
|
|
2873
|
+
? React.cloneElement(child, { setItemFormPopup, itemFormPopup, clusterRef })
|
|
2905
2874
|
: child) }), geo && (jsxRuntime.jsx(reactLeaflet.GeoJSON, { data: geo, onEachFeature: onEachFeature, eventHandlers: {
|
|
2906
2875
|
click: (e) => {
|
|
2907
2876
|
if (selectNewItemPosition) {
|
|
@@ -2981,14 +2950,14 @@ const rgbToHex = (r, g, b) => '#' +
|
|
|
2981
2950
|
* @category Input
|
|
2982
2951
|
*/
|
|
2983
2952
|
function TextAreaInput({ labelTitle, dataField, labelStyle, containerStyle, inputStyle, defaultValue, placeholder, required = true, updateFormValue, }) {
|
|
2984
|
-
const ref =
|
|
2985
|
-
const [inputValue, setInputValue] =
|
|
2953
|
+
const ref = React.useRef(null);
|
|
2954
|
+
const [inputValue, setInputValue] = React.useState(defaultValue);
|
|
2986
2955
|
const tags = useTags();
|
|
2987
2956
|
const values = [];
|
|
2988
2957
|
tags.forEach((tag) => {
|
|
2989
2958
|
values.push({ key: tag.name, value: tag.name, color: tag.color });
|
|
2990
2959
|
});
|
|
2991
|
-
|
|
2960
|
+
React.useEffect(() => {
|
|
2992
2961
|
setInputValue(defaultValue);
|
|
2993
2962
|
}, [defaultValue]);
|
|
2994
2963
|
const handleChange = (e) => {
|
|
@@ -2998,16 +2967,16 @@ function TextAreaInput({ labelTitle, dataField, labelStyle, containerStyle, inpu
|
|
|
2998
2967
|
updateFormValue(newValue);
|
|
2999
2968
|
}
|
|
3000
2969
|
};
|
|
3001
|
-
return (jsxRuntime.jsxs("div", { className: `tw-form-control tw-w-full ${containerStyle
|
|
2970
|
+
return (jsxRuntime.jsxs("div", { className: `tw-form-control tw-w-full ${containerStyle ?? ''}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: 'tw-label', children: jsxRuntime.jsx("span", { className: `tw-label-text tw-text-base-content ${labelStyle ?? ''}`, children: labelTitle }) })) : null, jsxRuntime.jsx("textarea", { required: required, ref: ref, value: inputValue, name: dataField, className: `tw-textarea tw-textarea-bordered tw-w-full tw-leading-5 ${inputStyle ?? ''}`, placeholder: placeholder ?? '', onChange: handleChange })] }));
|
|
3002
2971
|
}
|
|
3003
2972
|
|
|
3004
2973
|
/**
|
|
3005
2974
|
* @category Input
|
|
3006
2975
|
*/
|
|
3007
2976
|
function TextInput({ labelTitle, labelStyle, type, dataField, containerStyle, inputStyle, defaultValue, placeholder, autocomplete, pattern, required = true, updateFormValue, }) {
|
|
3008
|
-
const [inputValue, setInputValue] =
|
|
3009
|
-
|
|
3010
|
-
setInputValue(defaultValue
|
|
2977
|
+
const [inputValue, setInputValue] = React.useState(defaultValue ?? '');
|
|
2978
|
+
React.useEffect(() => {
|
|
2979
|
+
setInputValue(defaultValue ?? '');
|
|
3011
2980
|
}, [defaultValue]);
|
|
3012
2981
|
const handleChange = (e) => {
|
|
3013
2982
|
const newValue = e.target.value;
|
|
@@ -3016,13 +2985,13 @@ function TextInput({ labelTitle, labelStyle, type, dataField, containerStyle, in
|
|
|
3016
2985
|
updateFormValue(newValue);
|
|
3017
2986
|
}
|
|
3018
2987
|
};
|
|
3019
|
-
return (jsxRuntime.jsxs("div", { className: `tw-form-control ${containerStyle}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: 'tw-label', children: jsxRuntime.jsx("span", { className: `tw-label-text tw-text-base-content ${labelStyle}`, children: labelTitle }) })) : null, jsxRuntime.jsx("input", { required: required, pattern: pattern, type: type
|
|
2988
|
+
return (jsxRuntime.jsxs("div", { className: `tw-form-control ${containerStyle ?? ''}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: 'tw-label', children: jsxRuntime.jsx("span", { className: `tw-label-text tw-text-base-content ${labelStyle ?? ''}`, children: labelTitle }) })) : null, jsxRuntime.jsx("input", { required: required, pattern: pattern, type: type ?? 'text', name: dataField, value: inputValue, placeholder: placeholder ?? '', autoComplete: autocomplete, onChange: handleChange, className: `tw-input tw-input-bordered tw-w-full ${inputStyle ?? ''}` })] }));
|
|
3020
2989
|
}
|
|
3021
2990
|
|
|
3022
2991
|
function ItemFormPopup(props) {
|
|
3023
|
-
const [spinner, setSpinner] =
|
|
3024
|
-
const [popupTitle, setPopupTitle] =
|
|
3025
|
-
const formRef =
|
|
2992
|
+
const [spinner, setSpinner] = React.useState(false);
|
|
2993
|
+
const [popupTitle, setPopupTitle] = React.useState('');
|
|
2994
|
+
const formRef = React.useRef(null);
|
|
3026
2995
|
const map = reactLeaflet.useMap();
|
|
3027
2996
|
const addItem = useAddItem();
|
|
3028
2997
|
const updateItem = useUpdateItem();
|
|
@@ -3041,6 +3010,11 @@ function ItemFormPopup(props) {
|
|
|
3041
3010
|
});
|
|
3042
3011
|
formItem.position = { type: 'Point', coordinates: [props.position.lng, props.position.lat] };
|
|
3043
3012
|
evt.preventDefault();
|
|
3013
|
+
const name = formItem.name ? formItem.name : user?.first_name;
|
|
3014
|
+
if (!name) {
|
|
3015
|
+
reactToastify.toast.error('Name is must be defined');
|
|
3016
|
+
return;
|
|
3017
|
+
}
|
|
3044
3018
|
setSpinner(true);
|
|
3045
3019
|
formItem.text &&
|
|
3046
3020
|
formItem.text
|
|
@@ -3072,18 +3046,18 @@ function ItemFormPopup(props) {
|
|
|
3072
3046
|
map.closePopup();
|
|
3073
3047
|
}
|
|
3074
3048
|
else {
|
|
3075
|
-
const item = items.find((i) => i.user_created?.id === user?.id && i.layer?.
|
|
3049
|
+
const item = items.find((i) => i.user_created?.id === user?.id && i.layer?.id === props.layer.id);
|
|
3076
3050
|
const uuid = crypto.randomUUID();
|
|
3077
3051
|
let success = false;
|
|
3078
3052
|
try {
|
|
3079
|
-
props.layer.
|
|
3053
|
+
props.layer.userProfileLayer &&
|
|
3080
3054
|
item &&
|
|
3081
3055
|
(await props.layer.api?.updateItem({ ...formItem, id: item.id }));
|
|
3082
|
-
(!props.layer.
|
|
3056
|
+
(!props.layer.userProfileLayer || !item) &&
|
|
3083
3057
|
(await props.layer.api?.createItem({
|
|
3084
3058
|
...formItem,
|
|
3059
|
+
name,
|
|
3085
3060
|
id: uuid,
|
|
3086
|
-
name: formItem.name ? formItem.name : user?.first_name,
|
|
3087
3061
|
}));
|
|
3088
3062
|
success = true;
|
|
3089
3063
|
// eslint-disable-next-line no-catch-all/no-catch-all
|
|
@@ -3092,14 +3066,13 @@ function ItemFormPopup(props) {
|
|
|
3092
3066
|
reactToastify.toast.error(error.toString());
|
|
3093
3067
|
}
|
|
3094
3068
|
if (success) {
|
|
3095
|
-
if (props.layer.
|
|
3069
|
+
if (props.layer.userProfileLayer && item)
|
|
3096
3070
|
updateItem({ ...item, ...formItem });
|
|
3097
|
-
if (!props.layer.
|
|
3071
|
+
if (!props.layer.userProfileLayer || !item) {
|
|
3098
3072
|
addItem({
|
|
3099
3073
|
...formItem,
|
|
3100
3074
|
name: (formItem.name ? formItem.name : user?.first_name) ?? '',
|
|
3101
3075
|
user_created: user ?? undefined,
|
|
3102
|
-
type: props.layer.itemType,
|
|
3103
3076
|
id: uuid,
|
|
3104
3077
|
layer: props.layer,
|
|
3105
3078
|
public_edit: !user,
|
|
@@ -3118,7 +3091,7 @@ function ItemFormPopup(props) {
|
|
|
3118
3091
|
formRef.current.reset();
|
|
3119
3092
|
}
|
|
3120
3093
|
};
|
|
3121
|
-
|
|
3094
|
+
React.useEffect(() => {
|
|
3122
3095
|
resetPopup();
|
|
3123
3096
|
}, [props.position]);
|
|
3124
3097
|
return (jsxRuntime.jsx(reactLeaflet.Popup, { minWidth: 275, maxWidth: 275, autoPanPadding: [20, 80], eventHandlers: {
|
|
@@ -3127,8 +3100,8 @@ function ItemFormPopup(props) {
|
|
|
3127
3100
|
resetPopup();
|
|
3128
3101
|
}, 100);
|
|
3129
3102
|
},
|
|
3130
|
-
}, position: props.position, children: jsxRuntime.jsxs("form", { ref: formRef, onReset: resetPopup, autoComplete: 'off', onSubmit: (e) => handleSubmit(e), children: [props.item ? (jsxRuntime.jsx("div", { className: 'tw-h-3' })) : (jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("b", { className: 'tw-text-xl tw-text-center tw-font-bold', children: props.layer.menuText }) })), props.children ? (
|
|
3131
|
-
?
|
|
3103
|
+
}, position: props.position, children: jsxRuntime.jsxs("form", { ref: formRef, onReset: resetPopup, autoComplete: 'off', onSubmit: (e) => handleSubmit(e), children: [props.item ? (jsxRuntime.jsx("div", { className: 'tw-h-3' })) : (jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("b", { className: 'tw-text-xl tw-text-center tw-font-bold', children: props.layer.menuText }) })), props.children ? (React.Children.toArray(props.children).map((child) => React.isValidElement(child)
|
|
3104
|
+
? React.cloneElement(child, {
|
|
3132
3105
|
item: props.item,
|
|
3133
3106
|
key: props.position.toString(),
|
|
3134
3107
|
setPopupTitle,
|
|
@@ -3170,13 +3143,80 @@ const calculateTimeDifference = (time) => {
|
|
|
3170
3143
|
};
|
|
3171
3144
|
};
|
|
3172
3145
|
|
|
3146
|
+
function EllipsisVerticalIcon({
|
|
3147
|
+
title,
|
|
3148
|
+
titleId,
|
|
3149
|
+
...props
|
|
3150
|
+
}, svgRef) {
|
|
3151
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
3152
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3153
|
+
viewBox: "0 0 16 16",
|
|
3154
|
+
fill: "currentColor",
|
|
3155
|
+
"aria-hidden": "true",
|
|
3156
|
+
"data-slot": "icon",
|
|
3157
|
+
ref: svgRef,
|
|
3158
|
+
"aria-labelledby": titleId
|
|
3159
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
3160
|
+
id: titleId
|
|
3161
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
3162
|
+
d: "M8 2a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM8 6.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM9.5 12.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Z"
|
|
3163
|
+
}));
|
|
3164
|
+
}
|
|
3165
|
+
const ForwardRef$9 = /*#__PURE__*/ React__namespace.forwardRef(EllipsisVerticalIcon);
|
|
3166
|
+
|
|
3167
|
+
function PencilIcon({
|
|
3168
|
+
title,
|
|
3169
|
+
titleId,
|
|
3170
|
+
...props
|
|
3171
|
+
}, svgRef) {
|
|
3172
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
3173
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3174
|
+
viewBox: "0 0 24 24",
|
|
3175
|
+
fill: "currentColor",
|
|
3176
|
+
"aria-hidden": "true",
|
|
3177
|
+
"data-slot": "icon",
|
|
3178
|
+
ref: svgRef,
|
|
3179
|
+
"aria-labelledby": titleId
|
|
3180
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
3181
|
+
id: titleId
|
|
3182
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
3183
|
+
d: "M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712ZM19.513 8.199l-3.712-3.712-12.15 12.15a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32L19.513 8.2Z"
|
|
3184
|
+
}));
|
|
3185
|
+
}
|
|
3186
|
+
const ForwardRef$8 = /*#__PURE__*/ React__namespace.forwardRef(PencilIcon);
|
|
3187
|
+
|
|
3188
|
+
function TrashIcon({
|
|
3189
|
+
title,
|
|
3190
|
+
titleId,
|
|
3191
|
+
...props
|
|
3192
|
+
}, svgRef) {
|
|
3193
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
3194
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3195
|
+
viewBox: "0 0 24 24",
|
|
3196
|
+
fill: "currentColor",
|
|
3197
|
+
"aria-hidden": "true",
|
|
3198
|
+
"data-slot": "icon",
|
|
3199
|
+
ref: svgRef,
|
|
3200
|
+
"aria-labelledby": titleId
|
|
3201
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
3202
|
+
id: titleId
|
|
3203
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
3204
|
+
fillRule: "evenodd",
|
|
3205
|
+
d: "M16.5 4.478v.227a48.816 48.816 0 0 1 3.878.512.75.75 0 1 1-.256 1.478l-.209-.035-1.005 13.07a3 3 0 0 1-2.991 2.77H8.084a3 3 0 0 1-2.991-2.77L4.087 6.66l-.209.035a.75.75 0 0 1-.256-1.478A48.567 48.567 0 0 1 7.5 4.705v-.227c0-1.564 1.213-2.9 2.816-2.951a52.662 52.662 0 0 1 3.369 0c1.603.051 2.815 1.387 2.815 2.951Zm-6.136-1.452a51.196 51.196 0 0 1 3.273 0C14.39 3.05 15 3.684 15 4.478v.113a49.488 49.488 0 0 0-6 0v-.113c0-.794.609-1.428 1.364-1.452Zm-.355 5.945a.75.75 0 1 0-1.5.058l.347 9a.75.75 0 1 0 1.499-.058l-.346-9Zm5.48.058a.75.75 0 1 0-1.498-.058l-.347 9a.75.75 0 0 0 1.5.058l.345-9Z",
|
|
3206
|
+
clipRule: "evenodd"
|
|
3207
|
+
}));
|
|
3208
|
+
}
|
|
3209
|
+
const ForwardRef$7 = /*#__PURE__*/ React__namespace.forwardRef(TrashIcon);
|
|
3210
|
+
|
|
3211
|
+
var TargetDotSVG = 'data:image/svg+xml;base64,PHN2ZwogICAgICAgICAgICAgICAgICAgICAgICAgICAgc3Ryb2tlPSdjdXJyZW50Q29sb3InCiAgICAgICAgICAgICAgICAgICAgICAgICAgICBmaWxsPSdjdXJyZW50Q29sb3InCiAgICAgICAgICAgICAgICAgICAgICAgICAgICBzdHJva2VXaWR0aD0nMCcKICAgICAgICAgICAgICAgICAgICAgICAgICAgIHZpZXdCb3g9JzAgMCA1MTIgNTEyJwogICAgICAgICAgICAgICAgICAgICAgICAgICAgY2xhc3NOYW1lPSd0dy13LTUgdHctaC01JwogICAgICAgICAgICAgICAgICAgICAgICAgICAgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJwogICAgICAgICAgICAgICAgICAgICAgICAgID4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9J00yNTYgMGMxNy43IDAgMzIgMTQuMyAzMiAzMlY0Mi40YzkzLjcgMTMuOSAxNjcuNyA4OCAxODEuNiAxODEuNkg0ODBjMTcuNyAwIDMyIDE0LjMgMzIgMzJzLTE0LjMgMzItMzIgMzJINDY5LjZjLTEzLjkgOTMuNy04OCAxNjcuNy0xODEuNiAxODEuNlY0ODBjMCAxNy43LTE0LjMgMzItMzIgMzJzLTMyLTE0LjMtMzItMzJWNDY5LjZDMTMwLjMgNDU1LjcgNTYuMyAzODEuNyA0Mi40IDI4OEgzMmMtMTcuNyAwLTMyLTE0LjMtMzItMzJzMTQuMy0zMiAzMi0zMkg0Mi40QzU2LjMgMTMwLjMgMTMwLjMgNTYuMyAyMjQgNDIuNFYzMmMwLTE3LjcgMTQuMy0zMiAzMi0zMnpNMTA3LjQgMjg4YzEyLjUgNTguMyA1OC40IDEwNC4xIDExNi42IDExNi42VjM4NGMwLTE3LjcgMTQuMy0zMiAzMi0zMnMzMiAxNC4zIDMyIDMydjIwLjZjNTguMy0xMi41IDEwNC4xLTU4LjQgMTE2LjYtMTE2LjZIMzg0Yy0xNy43IDAtMzItMTQuMy0zMi0zMnMxNC4zLTMyIDMyLTMyaDIwLjZDMzkyLjEgMTY1LjcgMzQ2LjMgMTE5LjkgMjg4IDEwNy40VjEyOGMwIDE3LjctMTQuMyAzMi0zMiAzMnMtMzItMTQuMy0zMi0zMlYxMDcuNEMxNjUuNyAxMTkuOSAxMTkuOSAxNjUuNyAxMDcuNCAyMjRIMTI4YzE3LjcgMCAzMiAxNC4zIDMyIDMycy0xNC4zIDMyLTMyIDMySDEwNy40ek0yNTYgMjI0YTMyIDMyIDAgMSAxIDAgNjQgMzIgMzIgMCAxIDEgMC02NHonPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICA8L3N2Zz4=';
|
|
3212
|
+
|
|
3173
3213
|
const isClickInsideRectangle = (e, element) => {
|
|
3174
3214
|
const r = element.getBoundingClientRect();
|
|
3175
3215
|
return e.clientX > r.left && e.clientX < r.right && e.clientY > r.top && e.clientY < r.bottom;
|
|
3176
3216
|
};
|
|
3177
3217
|
const DialogModal = ({ title, isOpened, onClose, children, showCloseButton = true, closeOnClickOutside = true, className, }) => {
|
|
3178
|
-
const ref =
|
|
3179
|
-
|
|
3218
|
+
const ref = React.useRef(null);
|
|
3219
|
+
React.useEffect(() => {
|
|
3180
3220
|
if (isOpened) {
|
|
3181
3221
|
ref.current?.showModal();
|
|
3182
3222
|
ref.current?.classList.remove('tw-hidden');
|
|
@@ -3196,19 +3236,19 @@ const DialogModal = ({ title, isOpened, onClose, children, showCloseButton = tru
|
|
|
3196
3236
|
};
|
|
3197
3237
|
|
|
3198
3238
|
function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallback, loading, hideMenu = false, big = false, truncateSubname = true, hideSubname = false, showAddress = false, }) {
|
|
3199
|
-
const [modalOpen, setModalOpen] =
|
|
3239
|
+
const [modalOpen, setModalOpen] = React.useState(false);
|
|
3200
3240
|
const hasUserPermission = useHasUserPermission();
|
|
3201
3241
|
const navigate = reactRouterDom.useNavigate();
|
|
3202
3242
|
const appState = useAppState();
|
|
3203
|
-
const [imageLoaded, setImageLoaded] =
|
|
3204
|
-
|
|
3243
|
+
const [imageLoaded, setImageLoaded] = React.useState(false);
|
|
3244
|
+
React.useEffect(() => {
|
|
3205
3245
|
setImageLoaded(false);
|
|
3206
3246
|
}, [item]);
|
|
3207
3247
|
const avatar = item.image &&
|
|
3208
3248
|
appState.assetsApi.url + item.image + `${big ? '?width=160&heigth=160' : '?width=80&heigth=80'}`;
|
|
3209
3249
|
const title = item.name;
|
|
3210
3250
|
const subtitle = item.subname;
|
|
3211
|
-
const [address] =
|
|
3251
|
+
const [address] = React.useState('');
|
|
3212
3252
|
const params = new URLSearchParams(window.location.search);
|
|
3213
3253
|
const openDeleteModal = async (event) => {
|
|
3214
3254
|
setModalOpen(true);
|
|
@@ -3217,29 +3257,29 @@ function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallba
|
|
|
3217
3257
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row', children: [jsxRuntime.jsx("div", { className: 'tw-grow tw-max-w-[calc(100%-60px)] }', children: jsxRuntime.jsxs("div", { className: 'flex items-center', children: [avatar && (jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsxs("div", { className: `${big ? 'tw-w-20' : 'tw-w-10'} tw-inline tw-items-center tw-justify-center overflow-hidden`, children: [jsxRuntime.jsx("img", { className: 'tw-w-full tw-h-full tw-object-cover tw-rounded-full', src: avatar, alt: item.name + ' logo', onLoad: () => setImageLoaded(true), onError: () => setImageLoaded(false), style: { display: imageLoaded ? 'block' : 'none' } }), !imageLoaded && (jsxRuntime.jsx("div", { className: 'tw-w-full tw-h-full tw-bg-gray-200 tw-rounded-full' }))] }) })), jsxRuntime.jsxs("div", { className: `${avatar ? 'tw-ml-2' : ''} tw-overflow-hidden`, children: [jsxRuntime.jsx("div", { className: `${big ? 'xl:tw-text-3xl tw-text-2xl' : 'tw-text-xl'} tw-font-semibold tw-truncate`, title: title, children: title }), showAddress && address && !hideSubname && (jsxRuntime.jsx("div", { className: `tw-text-xs tw-text-gray-500 ${truncateSubname && 'tw-truncate'}`, children: address })), subtitle && !hideSubname && (jsxRuntime.jsx("div", { className: `tw-text-xs tw-text-gray-500 ${truncateSubname && 'tw-truncate'}`, children: subtitle }))] })] }) }), jsxRuntime.jsx("div", { onClick: (e) => e.stopPropagation(), className: `${big ? 'tw-mt-5' : 'tw-mt-1'}`, children: (api?.deleteItem || item.layer?.api?.updateItem) &&
|
|
3218
3258
|
(hasUserPermission(api?.collectionName, 'delete', item) ||
|
|
3219
3259
|
hasUserPermission(api?.collectionName, 'update', item)) &&
|
|
3220
|
-
!hideMenu && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-bg-base-100 tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx(
|
|
3260
|
+
!hideMenu && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-bg-base-100 tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx(ForwardRef$9, { className: 'tw-h-5 tw-w-5' }) }), jsxRuntime.jsxs("ul", { tabIndex: 0, className: 'tw-dropdown-content tw-menu tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-z-1000', children: [api?.updateItem &&
|
|
3221
3261
|
hasUserPermission(api.collectionName, 'update', item) &&
|
|
3222
3262
|
editCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: '!tw-text-base-content tw-cursor-pointer', onClick: (e) => item.layer?.customEditLink
|
|
3223
3263
|
? navigate(`${item.layer.customEditLink}${item.layer.customEditParameter ? `/${item.id}${params && '?' + params}` : ''} `)
|
|
3224
|
-
: editCallback(e), children: jsxRuntime.jsx(
|
|
3264
|
+
: editCallback(e), children: jsxRuntime.jsx(ForwardRef$8, { className: 'tw-h-5 tw-w-5' }) }) })), api?.updateItem &&
|
|
3225
3265
|
hasUserPermission(api.collectionName, 'update', item) &&
|
|
3226
|
-
setPositionCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: '!tw-text-base-content tw-cursor-pointer', onClick: setPositionCallback, children: jsxRuntime.jsx("
|
|
3266
|
+
setPositionCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: '!tw-text-base-content tw-cursor-pointer', onClick: setPositionCallback, children: jsxRuntime.jsx("img", { src: TargetDotSVG, alt: 'Position', className: 'tw-w-5 tw-h-5' }) }) })), api?.deleteItem &&
|
|
3227
3267
|
hasUserPermission(api.collectionName, 'delete', item) &&
|
|
3228
|
-
deleteCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: 'tw-cursor-pointer !tw-text-error', onClick: openDeleteModal, children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-sm' })) : (jsxRuntime.jsx(
|
|
3268
|
+
deleteCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: 'tw-cursor-pointer !tw-text-error', onClick: openDeleteModal, children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-sm' })) : (jsxRuntime.jsx(ForwardRef$7, { className: 'tw-h-5 tw-w-5' })) }) }))] })] })) })] }), jsxRuntime.jsx(DialogModal, { isOpened: modalOpen, title: 'Are you sure?', showCloseButton: false, onClose: () => setModalOpen(false), children: jsxRuntime.jsxs("div", { onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("span", { children: ["Do you want to delete ", jsxRuntime.jsx("b", { children: item.name }), "?"] }), jsxRuntime.jsx("div", { className: 'tw-grid', children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-justify-between', children: [jsxRuntime.jsx("label", { className: 'tw-btn tw-mt-4 tw-btn-error', onClick: (e) => {
|
|
3229
3269
|
deleteCallback(e);
|
|
3230
3270
|
setModalOpen(false);
|
|
3231
3271
|
}, children: "Yes" }), jsxRuntime.jsx("label", { className: 'tw-btn tw-mt-4', onClick: () => setModalOpen(false), children: "No" })] }) })] }) })] }));
|
|
3232
3272
|
}
|
|
3233
3273
|
|
|
3234
3274
|
// eslint-disable-next-line react/display-name
|
|
3235
|
-
const ItemViewPopup =
|
|
3275
|
+
const ItemViewPopup = React.forwardRef((props, ref) => {
|
|
3236
3276
|
const map = reactLeaflet.useMap();
|
|
3237
|
-
const [loading, setLoading] =
|
|
3277
|
+
const [loading, setLoading] = React.useState(false);
|
|
3238
3278
|
const removeItem = useRemoveItem();
|
|
3239
3279
|
const updadateItem = useUpdateItem();
|
|
3240
3280
|
const navigate = reactRouterDom.useNavigate();
|
|
3241
3281
|
const setSelectPosition = useSetSelectPosition();
|
|
3242
|
-
const [infoExpanded, setInfoExpanded] =
|
|
3282
|
+
const [infoExpanded, setInfoExpanded] = React.useState(false);
|
|
3243
3283
|
const handleEdit = (event) => {
|
|
3244
3284
|
event.stopPropagation();
|
|
3245
3285
|
map.closePopup();
|
|
@@ -3256,9 +3296,9 @@ const ItemViewPopup = react.forwardRef((props, ref) => {
|
|
|
3256
3296
|
setLoading(true);
|
|
3257
3297
|
let success = false;
|
|
3258
3298
|
try {
|
|
3259
|
-
!props.item.layer?.
|
|
3299
|
+
!props.item.layer?.userProfileLayer &&
|
|
3260
3300
|
(await props.item.layer?.api?.deleteItem(props.item.id));
|
|
3261
|
-
props.item.layer?.
|
|
3301
|
+
props.item.layer?.userProfileLayer &&
|
|
3262
3302
|
(await props.item.layer.api?.updateItem({ id: props.item.id, position: null }));
|
|
3263
3303
|
success = true;
|
|
3264
3304
|
// eslint-disable-next-line no-catch-all/no-catch-all
|
|
@@ -3268,8 +3308,8 @@ const ItemViewPopup = react.forwardRef((props, ref) => {
|
|
|
3268
3308
|
reactToastify.toast.error(error.toString());
|
|
3269
3309
|
}
|
|
3270
3310
|
if (success) {
|
|
3271
|
-
!props.item.layer?.
|
|
3272
|
-
props.item.layer?.
|
|
3311
|
+
!props.item.layer?.userProfileLayer && removeItem(props.item);
|
|
3312
|
+
props.item.layer?.userProfileLayer && updadateItem({ ...props.item, position: undefined });
|
|
3273
3313
|
reactToastify.toast.success('Item deleted');
|
|
3274
3314
|
}
|
|
3275
3315
|
setLoading(false);
|
|
@@ -3282,15 +3322,15 @@ const ItemViewPopup = react.forwardRef((props, ref) => {
|
|
|
3282
3322
|
map.closePopup();
|
|
3283
3323
|
setSelectPosition(props.item);
|
|
3284
3324
|
navigate('/');
|
|
3285
|
-
}, loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: props.children ? (
|
|
3286
|
-
?
|
|
3325
|
+
}, loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: props.children ? (React.Children.toArray(props.children).map((child) => React.isValidElement(child)
|
|
3326
|
+
? React.cloneElement(child, { item: props.item })
|
|
3287
3327
|
: '')) : (jsxRuntime.jsx(TextView, { text: props.item.text, itemId: props.item.id })) }), jsxRuntime.jsxs("div", { className: 'tw-flex -tw-mb-1 tw-flex-row tw-mr-2 tw-mt-1', children: [infoExpanded ? (jsxRuntime.jsx("p", { className: 'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500', children: `${props.item.date_updated && props.item.date_updated !== props.item.date_created ? 'updated' : 'posted'} ${props.item && props.item.user_created && props.item.user_created.first_name ? `by ${props.item.user_created.first_name}` : ''} ${props.item.date_updated ? timeAgo(props.item.date_updated) : timeAgo(props.item.date_created)}` })) : (jsxRuntime.jsx("p", { className: '!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500', onClick: () => setInfoExpanded(true), children: "\u24D8" })), jsxRuntime.jsx("div", { className: 'tw-grow' })] })] }) }));
|
|
3288
3328
|
});
|
|
3289
3329
|
|
|
3290
3330
|
/**
|
|
3291
3331
|
* @category Map
|
|
3292
3332
|
*/
|
|
3293
|
-
const Layer = ({ data, children, name = 'places', menuIcon = 'MapPinIcon', menuText = 'add new place', menuColor = '#2E7D32', markerIcon = 'point', markerShape = 'circle', markerDefaultColor = '#777', markerDefaultColor2 = 'RGBA(35, 31, 32, 0.2)', api, itemType,
|
|
3333
|
+
const Layer = ({ data, children, name = 'places', menuIcon = 'MapPinIcon', menuText = 'add new place', menuColor = '#2E7D32', markerIcon = 'point', markerShape = 'circle', markerDefaultColor = '#777', markerDefaultColor2 = 'RGBA(35, 31, 32, 0.2)', api, itemType, userProfileLayer = false, customEditLink, customEditParameter,
|
|
3294
3334
|
// eslint-disable-next-line camelcase
|
|
3295
3335
|
public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }) => {
|
|
3296
3336
|
const filterTags = useFilterTags();
|
|
@@ -3307,12 +3347,12 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3307
3347
|
const selectPosition = useSelectPosition();
|
|
3308
3348
|
const tags = useTags();
|
|
3309
3349
|
const addTag = useAddTag();
|
|
3310
|
-
const [newTagsToAdd, setNewTagsToAdd] =
|
|
3311
|
-
const [tagsReady, setTagsReady] =
|
|
3350
|
+
const [newTagsToAdd, setNewTagsToAdd] = React.useState([]);
|
|
3351
|
+
const [tagsReady, setTagsReady] = React.useState(false);
|
|
3312
3352
|
const isLayerVisible = useIsLayerVisible();
|
|
3313
3353
|
const isGroupTypeVisible = useIsGroupTypeVisible();
|
|
3314
3354
|
const visibleGroupTypes = useVisibleGroupType();
|
|
3315
|
-
|
|
3355
|
+
React.useEffect(() => {
|
|
3316
3356
|
data &&
|
|
3317
3357
|
setItemsData({
|
|
3318
3358
|
data,
|
|
@@ -3327,7 +3367,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3327
3367
|
markerDefaultColor2,
|
|
3328
3368
|
api,
|
|
3329
3369
|
itemType,
|
|
3330
|
-
|
|
3370
|
+
userProfileLayer,
|
|
3331
3371
|
// Can we just use editCallback for all cases?
|
|
3332
3372
|
customEditLink,
|
|
3333
3373
|
customEditParameter,
|
|
@@ -3353,7 +3393,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3353
3393
|
markerDefaultColor2,
|
|
3354
3394
|
api,
|
|
3355
3395
|
itemType,
|
|
3356
|
-
|
|
3396
|
+
userProfileLayer,
|
|
3357
3397
|
customEditLink,
|
|
3358
3398
|
customEditParameter,
|
|
3359
3399
|
// eslint-disable-next-line camelcase
|
|
@@ -3366,7 +3406,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3366
3406
|
});
|
|
3367
3407
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3368
3408
|
}, [data, api]);
|
|
3369
|
-
|
|
3409
|
+
React.useEffect(() => {
|
|
3370
3410
|
if (tagsReady) {
|
|
3371
3411
|
const processedTags = {};
|
|
3372
3412
|
newTagsToAdd.map((newtag) => {
|
|
@@ -3440,7 +3480,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3440
3480
|
selectPosition && setMarkerClicked(item);
|
|
3441
3481
|
},
|
|
3442
3482
|
}, icon: MarkerIconFactory(markerShape, color1, color2, item.markerIcon ? item.markerIcon : markerIcon), position: [latitude, longitude], children: [children &&
|
|
3443
|
-
|
|
3483
|
+
React.Children.toArray(children).some((child) => isComponentWithType(child) && child.type.__TYPE === 'ItemView') ? (React.Children.toArray(children).map((child) => isComponentWithType(child) && child.type.__TYPE === 'ItemView' ? (jsxRuntime.jsx(ItemViewPopup, { ref: (r) => {
|
|
3444
3484
|
if (!(item.id in leafletRefs && leafletRefs[item.id].popup === r)) {
|
|
3445
3485
|
r && addPopup(item, r);
|
|
3446
3486
|
}
|
|
@@ -3455,10 +3495,10 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
|
|
|
3455
3495
|
}), itemFormPopup &&
|
|
3456
3496
|
itemFormPopup.layer.name === name &&
|
|
3457
3497
|
(children &&
|
|
3458
|
-
|
|
3498
|
+
React.Children.toArray(children).some((child) => isComponentWithType(child) && child.type.__TYPE === 'ItemForm') ? (React.Children.toArray(children).map((child) => isComponentWithType(child) && child.type.__TYPE === 'ItemForm' ? (jsxRuntime.jsx(ItemFormPopup, { position: itemFormPopup.position, layer: itemFormPopup.layer, setItemFormPopup: setItemFormPopup, item: itemFormPopup.item, children: child }, setItemFormPopup?.name)) : (''))) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(ItemFormPopup, { position: itemFormPopup.position, layer: itemFormPopup.layer, setItemFormPopup: setItemFormPopup, item: itemFormPopup.item }) })))] }));
|
|
3459
3499
|
};
|
|
3460
3500
|
function isComponentWithType(node) {
|
|
3461
|
-
return
|
|
3501
|
+
return React.isValidElement(node) && typeof node.type !== 'string' && '__TYPE' in node.type;
|
|
3462
3502
|
}
|
|
3463
3503
|
|
|
3464
3504
|
/**
|
|
@@ -3467,7 +3507,7 @@ function isComponentWithType(node) {
|
|
|
3467
3507
|
function Tags({ data, api }) {
|
|
3468
3508
|
const setTagData = useSetTagData();
|
|
3469
3509
|
const setTagApi = useSetTagApi();
|
|
3470
|
-
|
|
3510
|
+
React.useEffect(() => {
|
|
3471
3511
|
data && setTagData(data);
|
|
3472
3512
|
api && setTagApi(api);
|
|
3473
3513
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -3477,7 +3517,7 @@ function Tags({ data, api }) {
|
|
|
3477
3517
|
const resetFilterTags = useResetFilterTags();
|
|
3478
3518
|
const tags = useTags();
|
|
3479
3519
|
const filterTags = useFilterTags();
|
|
3480
|
-
|
|
3520
|
+
React.useEffect(() => {
|
|
3481
3521
|
const params = new URLSearchParams(location.search);
|
|
3482
3522
|
const urlTags = params.get('tags');
|
|
3483
3523
|
const decodedTags = urlTags ? decodeURIComponent(urlTags) : '';
|
|
@@ -3504,7 +3544,7 @@ function Permissions({ data, api, adminRole }) {
|
|
|
3504
3544
|
const setPermissionApi = useSetPermissionApi();
|
|
3505
3545
|
const setAdminRole = useSetAdminRole();
|
|
3506
3546
|
const { user } = useAuth();
|
|
3507
|
-
|
|
3547
|
+
React.useEffect(() => {
|
|
3508
3548
|
adminRole && setAdminRole(adminRole);
|
|
3509
3549
|
data && setPermissionData(data);
|
|
3510
3550
|
api && setPermissionApi(api);
|
|
@@ -3517,13 +3557,13 @@ function Permissions({ data, api, adminRole }) {
|
|
|
3517
3557
|
* @category Map
|
|
3518
3558
|
*/
|
|
3519
3559
|
const ItemForm = ({ children, item, title, setPopupTitle, }) => {
|
|
3520
|
-
|
|
3560
|
+
React.useEffect(() => {
|
|
3521
3561
|
setPopupTitle && title && setPopupTitle(title);
|
|
3522
3562
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3523
3563
|
}, [title]);
|
|
3524
3564
|
return (jsxRuntime.jsx("div", { children: children
|
|
3525
|
-
?
|
|
3526
|
-
?
|
|
3565
|
+
? React.Children.toArray(children).map((child) => React.isValidElement(child)
|
|
3566
|
+
? React.cloneElement(child, { item, test: 'test' })
|
|
3527
3567
|
: '')
|
|
3528
3568
|
: '' }));
|
|
3529
3569
|
};
|
|
@@ -3534,7 +3574,7 @@ ItemForm.__TYPE = 'ItemForm';
|
|
|
3534
3574
|
*/
|
|
3535
3575
|
const ItemView = ({ children, item }) => {
|
|
3536
3576
|
return (jsxRuntime.jsx("div", { children: children
|
|
3537
|
-
?
|
|
3577
|
+
? React.Children.toArray(children).map((child) => React.isValidElement(child) ? React.cloneElement(child, { item }) : null)
|
|
3538
3578
|
: null }));
|
|
3539
3579
|
};
|
|
3540
3580
|
ItemView.__TYPE = 'ItemView';
|
|
@@ -3544,12 +3584,12 @@ ItemView.__TYPE = 'ItemView';
|
|
|
3544
3584
|
*/
|
|
3545
3585
|
function SelectBox(props) {
|
|
3546
3586
|
const { labelTitle, labelDescription, defaultValue, containerStyle, placeholder, labelStyle, options, updateFormValue, } = props;
|
|
3547
|
-
const [value, setValue] =
|
|
3587
|
+
const [value, setValue] = React.useState(defaultValue || '');
|
|
3548
3588
|
const updateValue = (newValue) => {
|
|
3549
3589
|
updateFormValue(newValue);
|
|
3550
3590
|
setValue(newValue);
|
|
3551
3591
|
};
|
|
3552
|
-
return (jsxRuntime.jsxs("div", { className: `tw-inline-block ${containerStyle}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: `tw-label ${labelStyle}`, children: jsxRuntime.jsxs("div", { className: 'tw-label-text', children: [labelTitle, labelDescription && (jsxRuntime.jsx("div", { className: 'tw-tooltip tw-tooltip-right', "data-tip": labelDescription, children: jsxRuntime.jsx(InformationCircleIcon, { className: 'tw-w-4 tw-h-4' }) }))] }) })) : (''), jsxRuntime.jsxs("select", { className: 'tw-select tw-select-bordered tw-w-full', value: value, onChange: (e) => updateValue(e.target.value), children: [jsxRuntime.jsx("option", { disabled: true, value: 'PLACEHOLDER', children: placeholder }), options.map((o, k) => {
|
|
3592
|
+
return (jsxRuntime.jsxs("div", { className: `tw-inline-block ${containerStyle ?? ''}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: `tw-label ${labelStyle ?? ''}`, children: jsxRuntime.jsxs("div", { className: 'tw-label-text', children: [labelTitle, labelDescription && (jsxRuntime.jsx("div", { className: 'tw-tooltip tw-tooltip-right', "data-tip": labelDescription, children: jsxRuntime.jsx(InformationCircleIcon, { className: 'tw-w-4 tw-h-4' }) }))] }) })) : (''), jsxRuntime.jsxs("select", { className: 'tw-select tw-select-bordered tw-w-full', value: value, onChange: (e) => updateValue(e.target.value), children: [jsxRuntime.jsx("option", { disabled: true, value: 'PLACEHOLDER', children: placeholder }), options.map((o, k) => {
|
|
3553
3593
|
return (jsxRuntime.jsx("option", { value: o.value || o.name, children: o.name }, k));
|
|
3554
3594
|
})] })] }));
|
|
3555
3595
|
}
|
|
@@ -3582,34 +3622,57 @@ const PopupCheckboxInput = ({ dataField, label, item, }) => {
|
|
|
3582
3622
|
return (jsxRuntime.jsxs("label", { htmlFor: item?.id, className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-1', children: [jsxRuntime.jsx("input", { id: item?.id, type: 'checkbox', name: dataField, className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: item?.public_edit }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2 tw-cursor-pointer', children: label })] }));
|
|
3583
3623
|
};
|
|
3584
3624
|
|
|
3625
|
+
function CalendarDaysIcon({
|
|
3626
|
+
title,
|
|
3627
|
+
titleId,
|
|
3628
|
+
...props
|
|
3629
|
+
}, svgRef) {
|
|
3630
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
3631
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3632
|
+
viewBox: "0 0 24 24",
|
|
3633
|
+
fill: "currentColor",
|
|
3634
|
+
"aria-hidden": "true",
|
|
3635
|
+
"data-slot": "icon",
|
|
3636
|
+
ref: svgRef,
|
|
3637
|
+
"aria-labelledby": titleId
|
|
3638
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
3639
|
+
id: titleId
|
|
3640
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
3641
|
+
d: "M12.75 12.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM7.5 15.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM8.25 17.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM9.75 15.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM10.5 17.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12 15.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM12.75 17.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM14.25 15.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM15 17.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM16.5 15.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM15 12.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM16.5 13.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z"
|
|
3642
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
3643
|
+
fillRule: "evenodd",
|
|
3644
|
+
d: "M6.75 2.25A.75.75 0 0 1 7.5 3v1.5h9V3A.75.75 0 0 1 18 3v1.5h.75a3 3 0 0 1 3 3v11.25a3 3 0 0 1-3 3H5.25a3 3 0 0 1-3-3V7.5a3 3 0 0 1 3-3H6V3a.75.75 0 0 1 .75-.75Zm13.5 9a1.5 1.5 0 0 0-1.5-1.5H5.25a1.5 1.5 0 0 0-1.5 1.5v7.5a1.5 1.5 0 0 0 1.5 1.5h13.5a1.5 1.5 0 0 0 1.5-1.5v-7.5Z",
|
|
3645
|
+
clipRule: "evenodd"
|
|
3646
|
+
}));
|
|
3647
|
+
}
|
|
3648
|
+
const ForwardRef$6 = /*#__PURE__*/ React__namespace.forwardRef(CalendarDaysIcon);
|
|
3649
|
+
|
|
3585
3650
|
/**
|
|
3586
3651
|
* @category Map
|
|
3587
3652
|
*/
|
|
3588
3653
|
const StartEndView = ({ item }) => {
|
|
3589
|
-
return (jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row tw-mb-4 tw-mt-1', children: [jsxRuntime.jsxs("div", { className: 'tw-basis-2/5 tw-flex tw-flex-row', children: [jsxRuntime.jsx(
|
|
3654
|
+
return (jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row tw-mb-4 tw-mt-1', children: [jsxRuntime.jsxs("div", { className: 'tw-basis-2/5 tw-flex tw-flex-row', children: [jsxRuntime.jsx(ForwardRef$6, { className: 'tw-h-4 tw-w-4 tw-mr-2' }), jsxRuntime.jsx("time", { className: 'tw-align-middle', dateTime: item && item.start ? item.start.substring(0, 10) : '', children: item && item.start ? new Date(item.start).toLocaleDateString() : '' })] }), jsxRuntime.jsx("div", { className: 'tw-basis-1/5 tw-place-content-center', children: jsxRuntime.jsx("span", { children: "-" }) }), jsxRuntime.jsxs("div", { className: 'tw-basis-2/5 tw-flex tw-flex-row', children: [jsxRuntime.jsx(ForwardRef$6, { className: 'tw-h-4 tw-w-4 tw-mr-2' }), jsxRuntime.jsx("time", { className: 'tw-align-middle', dateTime: item && item.end ? item.end.substring(0, 10) : '', children: item && item.end ? new Date(item.end).toLocaleDateString() : '' })] })] }));
|
|
3590
3655
|
};
|
|
3591
3656
|
|
|
3592
|
-
function NavBar({ appName
|
|
3657
|
+
function NavBar({ appName }) {
|
|
3593
3658
|
const { isAuthenticated, user, logout } = useAuth();
|
|
3594
|
-
const [userProfile, setUserProfile] =
|
|
3659
|
+
const [userProfile, setUserProfile] = React.useState({});
|
|
3595
3660
|
const items = useItems();
|
|
3596
|
-
|
|
3597
|
-
const profile = user &&
|
|
3598
|
-
items.find((i) => i.user_created?.id === user.id && i.layer?.itemType.name === userType);
|
|
3661
|
+
React.useEffect(() => {
|
|
3662
|
+
const profile = user && items.find((i) => i.user_created?.id === user.id && i.layer?.userProfileLayer);
|
|
3599
3663
|
profile
|
|
3600
3664
|
? setUserProfile(profile)
|
|
3601
3665
|
: setUserProfile({ id: crypto.randomUUID(), name: user?.first_name ?? '', text: '' });
|
|
3602
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3603
3666
|
}, [user, items]);
|
|
3604
3667
|
// useEffect(() => {}, [userProfile])
|
|
3605
|
-
const nameRef =
|
|
3606
|
-
const [nameWidth, setNameWidth] =
|
|
3668
|
+
const nameRef = React.useRef(null);
|
|
3669
|
+
const [nameWidth, setNameWidth] = React.useState(0);
|
|
3607
3670
|
const location = reactRouterDom.useLocation();
|
|
3608
|
-
const [showNav, setShowNav] =
|
|
3609
|
-
|
|
3671
|
+
const [showNav, setShowNav] = React.useState(false);
|
|
3672
|
+
React.useEffect(() => {
|
|
3610
3673
|
showNav && nameRef.current && setNameWidth(nameRef.current.scrollWidth);
|
|
3611
3674
|
}, [nameRef, appName, showNav]);
|
|
3612
|
-
|
|
3675
|
+
React.useEffect(() => {
|
|
3613
3676
|
const params = new URLSearchParams(location.search);
|
|
3614
3677
|
const embedded = params.get('embedded');
|
|
3615
3678
|
embedded !== 'true' && setShowNav(true);
|
|
@@ -3632,46 +3695,43 @@ function NavBar({ appName, userType }) {
|
|
|
3632
3695
|
});
|
|
3633
3696
|
};
|
|
3634
3697
|
if (showNav) {
|
|
3635
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: 'tw-navbar tw-bg-base-100 tw-z-[9998] tw-shadow-xl tw-relative', children: [jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-square tw-btn-ghost', "data-te-sidenav-toggle-ref": true, "data-te-target": '#sidenav', "aria-controls": '#sidenav', "aria-haspopup": 'true', children: jsxRuntime.jsx(
|
|
3698
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: 'tw-navbar tw-bg-base-100 tw-z-[9998] tw-shadow-xl tw-relative', children: [jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-square tw-btn-ghost', "data-te-sidenav-toggle-ref": true, "data-te-target": '#sidenav', "aria-controls": '#sidenav', "aria-haspopup": 'true', children: jsxRuntime.jsx(ForwardRef$a, { className: 'tw-inline-block tw-w-5 tw-h-5' }) }), jsxRuntime.jsx("div", { className: 'tw-flex-1 tw-mr-2', children: jsxRuntime.jsxs("div", { className: 'tw-flex-1 tw-truncate tw-grid tw-grid-flow-col', style: { maxWidth: nameWidth + 60 }, children: [jsxRuntime.jsx(reactRouterDom.Link, { className: 'tw-btn tw-btn-ghost tw-px-2 tw-normal-case tw-text-xl tw-flex-1 tw-truncate', to: '/', children: jsxRuntime.jsx("h1", { ref: nameRef, className: 'tw-truncate', children: appName }) }), jsxRuntime.jsx("button", { className: 'tw-btn tw-px-2 tw-btn-ghost', onClick: () => window.my_modal_3.showModal(), children: jsxRuntime.jsx(QuestionMarkIcon, { className: 'tw-h-5 tw-w-5' }) })] }) }), isAuthenticated ? (jsxRuntime.jsxs("div", { className: 'tw-flex-none', children: [jsxRuntime.jsxs(reactRouterDom.Link, { to: `${userProfile.id && '/item/' + userProfile.id}`, className: 'tw-flex tw-items-center', children: [userProfile.image && (jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-w-10 tw-rounded-full', children: jsxRuntime.jsx("img", { src: 'https://api.utopia-lab.org/assets/' + userProfile.image }) }) })), jsxRuntime.jsx("div", { className: 'tw-ml-2 tw-mr-2', children: userProfile.name || user?.first_name })] }), jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-end', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-btn tw-btn-ghost tw-btn-square', children: jsxRuntime.jsx(ForwardRef$9, { className: 'tw-h-5 tw-w-5' }) }), jsxRuntime.jsxs("ul", { tabIndex: 0, className: 'tw-menu tw-menu-compact tw-dropdown-content tw-mt-3 tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-w-52 !tw-z-[10000]', children: [jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: `${userProfile.id && '/edit-item/' + userProfile.id}`, children: "Profile" }) }), jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/user-settings', children: "Settings" }) }), jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { onClick: () => {
|
|
3636
3699
|
void onLogout();
|
|
3637
|
-
}, children: "Logout" }) })] })] })] })) : (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs("div", { className: 'tw-hidden md:tw-flex', children: [jsxRuntime.jsx(reactRouterDom.Link, { to: '/login', children: jsxRuntime.jsx("div", { className: 'tw-btn tw-btn-ghost tw-mr-2', children: "Login" }) }), jsxRuntime.jsx(reactRouterDom.Link, { to: '/signup', children: jsxRuntime.jsx("div", { className: 'tw-btn tw-btn-ghost tw-mr-2', children: "Sign Up" }) })] }), jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-end', children: [jsxRuntime.jsx("label", { tabIndex: 1, className: 'tw-btn tw-btn-ghost md:tw-hidden', children: jsxRuntime.jsx(
|
|
3700
|
+
}, children: "Logout" }) })] })] })] })) : (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs("div", { className: 'tw-hidden md:tw-flex', children: [jsxRuntime.jsx(reactRouterDom.Link, { to: '/login', children: jsxRuntime.jsx("div", { className: 'tw-btn tw-btn-ghost tw-mr-2', children: "Login" }) }), jsxRuntime.jsx(reactRouterDom.Link, { to: '/signup', children: jsxRuntime.jsx("div", { className: 'tw-btn tw-btn-ghost tw-mr-2', children: "Sign Up" }) })] }), jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-end', children: [jsxRuntime.jsx("label", { tabIndex: 1, className: 'tw-btn tw-btn-ghost md:tw-hidden', children: jsxRuntime.jsx(ForwardRef$9, { className: 'tw-h-5 tw-w-5' }) }), jsxRuntime.jsxs("ul", { tabIndex: 1, className: 'tw-menu tw-dropdown-content tw-mt-3 tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-w-52 !tw-z-[10000]', children: [jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/login', children: "Login" }) }), jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/signup', children: "Sign Up" }) })] })] })] }))] }) }));
|
|
3638
3701
|
}
|
|
3639
3702
|
else
|
|
3640
3703
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
3641
3704
|
}
|
|
3642
3705
|
|
|
3643
|
-
const SetAppState = ({ assetsApi
|
|
3706
|
+
const SetAppState = ({ assetsApi }) => {
|
|
3644
3707
|
const setAppState = useSetAppState();
|
|
3645
|
-
|
|
3708
|
+
React.useEffect(() => {
|
|
3646
3709
|
setAppState({ assetsApi });
|
|
3647
3710
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3648
3711
|
}, [assetsApi]);
|
|
3649
|
-
react.useEffect(() => {
|
|
3650
|
-
setAppState({ userType });
|
|
3651
|
-
}, [setAppState, userType]);
|
|
3652
3712
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
3653
3713
|
};
|
|
3654
3714
|
|
|
3655
3715
|
/**
|
|
3656
3716
|
* @category AppShell
|
|
3657
3717
|
*/
|
|
3658
|
-
function AppShell({ appName, children, assetsApi,
|
|
3659
|
-
return (jsxRuntime.jsx(ContextWrapper, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-col tw-h-full', children: [jsxRuntime.jsx(SetAppState, { assetsApi: assetsApi
|
|
3718
|
+
function AppShell({ appName, children, assetsApi, }) {
|
|
3719
|
+
return (jsxRuntime.jsx(ContextWrapper, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-col tw-h-full', children: [jsxRuntime.jsx(SetAppState, { assetsApi: assetsApi }), jsxRuntime.jsx(NavBar, { appName: appName }), jsxRuntime.jsx("div", { id: 'app-content', className: 'tw-flex-grow', children: children })] }) }));
|
|
3660
3720
|
}
|
|
3661
3721
|
|
|
3662
3722
|
function SidebarSubmenu({ submenu, name, icon, }) {
|
|
3663
3723
|
const location = reactRouterDom.useLocation();
|
|
3664
|
-
const [isExpanded, setIsExpanded] =
|
|
3724
|
+
const [isExpanded, setIsExpanded] = React.useState(false);
|
|
3665
3725
|
/** Open Submenu list if path found in routes, this is for directly loading submenu routes first time */
|
|
3666
|
-
|
|
3667
|
-
if (submenu
|
|
3726
|
+
React.useEffect(() => {
|
|
3727
|
+
if (submenu?.filter((m) => {
|
|
3668
3728
|
return m.path === location.pathname;
|
|
3669
3729
|
})[0])
|
|
3670
3730
|
setIsExpanded(true);
|
|
3671
3731
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3672
3732
|
}, []);
|
|
3673
3733
|
return (jsxRuntime.jsxs("div", { className: 'flex-col', children: [jsxRuntime.jsxs("div", { className: 'w-full', onClick: () => setIsExpanded(!isExpanded), children: [icon, ' ', jsxRuntime.jsxs("span", { className: "group-[&[data-te-sidenav-slim-collapsed='true']]:data-[te-sidenav-slim='false']:hidden", "data-te-sidenav-slim": 'false', children: [name, ' '] }), jsxRuntime.jsx(ChevronDownIcon, { className: 'w-5 h-5 mt-1 float-right delay-400 duration-500 transition-all ' +
|
|
3674
|
-
(isExpanded ? 'rotate-180' : '') })] }), jsxRuntime.jsx("div", { className: ' w-full data-[te-collapse-show]:!hidden ' + (isExpanded ? '' : 'hidden'), children: jsxRuntime.jsx("ul", { className: 'menu menu-compact', children: submenu
|
|
3734
|
+
(isExpanded ? 'rotate-180' : '') })] }), jsxRuntime.jsx("div", { className: ' w-full data-[te-collapse-show]:!hidden ' + (isExpanded ? '' : 'hidden'), children: jsxRuntime.jsx("ul", { className: 'menu menu-compact', children: submenu?.map((m, k) => {
|
|
3675
3735
|
return (jsxRuntime.jsx("li", { children: jsxRuntime.jsxs(reactRouterDom.Link, { to: m.path, className: '', children: [m.icon, jsxRuntime.jsx("span", { className: '', "data-te-sidenav-slim": 'false', children: m.name }), location.pathname === m.path ? (jsxRuntime.jsx("span", { className: 'absolute mt-1 mb-1 inset-y-0 left-0 w-1 rounded-tr-md rounded-br-md bg-primary ', "aria-hidden": 'true' })) : null] }) }, k));
|
|
3676
3736
|
}) }) })] }));
|
|
3677
3737
|
}
|
|
@@ -3681,40 +3741,44 @@ function SidebarSubmenu({ submenu, name, icon, }) {
|
|
|
3681
3741
|
*/
|
|
3682
3742
|
function SideBar({ routes, bottomRoutes }) {
|
|
3683
3743
|
// prevent react18 from calling useEffect twice
|
|
3684
|
-
const init =
|
|
3744
|
+
const init = React.useRef(false);
|
|
3685
3745
|
const location = reactRouterDom.useLocation();
|
|
3686
|
-
const [instance, setInstance] =
|
|
3687
|
-
const [slim, setSlim] =
|
|
3746
|
+
const [instance, setInstance] = React.useState();
|
|
3747
|
+
const [slim, setSlim] = React.useState(false);
|
|
3688
3748
|
const toggleSlim = () => {
|
|
3689
3749
|
setSlim(!slim);
|
|
3690
|
-
instance
|
|
3750
|
+
instance?.toggleSlim();
|
|
3691
3751
|
};
|
|
3692
|
-
|
|
3752
|
+
React.useEffect(() => {
|
|
3693
3753
|
if (!init.current) {
|
|
3754
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call
|
|
3694
3755
|
twElements.initTE({ Sidenav: twElements.Sidenav });
|
|
3756
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
|
|
3695
3757
|
const instance = twElements.Sidenav.getInstance(document.getElementById('sidenav'));
|
|
3696
3758
|
setInstance(instance);
|
|
3697
3759
|
instance.toggleSlim();
|
|
3698
3760
|
init.current = true;
|
|
3699
3761
|
}
|
|
3700
3762
|
}, []);
|
|
3701
|
-
const [embedded, setEmbedded] =
|
|
3702
|
-
|
|
3763
|
+
const [embedded, setEmbedded] = React.useState(true);
|
|
3764
|
+
React.useEffect(() => {
|
|
3703
3765
|
const params = new URLSearchParams(location.search);
|
|
3704
3766
|
const embedded = params.get('embedded');
|
|
3705
3767
|
embedded !== 'true' && setEmbedded(false);
|
|
3706
3768
|
}, [location]);
|
|
3707
3769
|
const params = new URLSearchParams(window.location.search);
|
|
3708
3770
|
return (jsxRuntime.jsx("nav", { id: 'sidenav', className: `group tw-fixed tw-left-0 ${embedded ? 'tw-mt-0 tw-h-[100dvh]' : 'tw-mt-16 tw-h-[calc(100dvh-64px)]'} tw-top-0 tw-z-[10035] tw--translate-x-full tw-overflow-hidden tw-shadow-xl data-[te-sidenav-slim='true']:tw-hidden data-[te-sidenav-slim-collapsed='true']:tw-w-[56px] data-[te-sidenav-slim='true']:tw-w-[56px] data-[te-sidenav-hidden='false']:tw-translate-x-0 dark:tw-bg-zinc-800 [&[data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='false']]:tw-hidden [&[data-te-sidenav-slim-collapsed='true'][data-te-sidenav-slim='true']]:[display:unset]`, "data-te-sidenav-init": true, "data-te-sidenav-hidden": 'true', "data-te-sidenav-mode": 'side', "data-te-sidenav-slim": 'true', "data-te-sidenav-content": '#app-content', "data-te-sidenav-slim-collapsed": 'true', "data-te-sidenav-slim-width": '56', "data-te-sidenav-width": '180', children: jsxRuntime.jsxs("div", { className: `tw-flex tw-flex-col ${embedded ? 'tw-h-full' : 'tw-h-[calc(100dvh-64px)]'}`, children: [jsxRuntime.jsx("ul", { className: 'tw-menu tw-w-full tw-bg-base-100 tw-text-base-content tw-p-0', "data-te-sidenav-menu-ref": true, children: routes.map((route, k) => {
|
|
3709
|
-
return (jsxRuntime.jsx("li", { className: '', children: route.submenu ? (jsxRuntime.jsx(SidebarSubmenu, { ...route })) : (jsxRuntime.jsxs(reactRouterDom.NavLink, { end: true, target: route.blank ? '_blank' : '_self',
|
|
3771
|
+
return (jsxRuntime.jsx("li", { className: '', children: route.submenu ? (jsxRuntime.jsx(SidebarSubmenu, { ...route })) : (jsxRuntime.jsxs(reactRouterDom.NavLink, { end: true, target: route.blank ? '_blank' : '_self',
|
|
3772
|
+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
|
|
3773
|
+
to: `${route.path}${params && '?' + params.toString()}`, className: ({ isActive }) => `${isActive ? 'tw-font-semibold tw-bg-base-200 !tw-rounded-none' : 'tw-font-normal !tw-rounded-none'}`, onClick: () => {
|
|
3710
3774
|
if (screen.width < 640 && !slim)
|
|
3711
|
-
instance
|
|
3775
|
+
instance?.toggle();
|
|
3712
3776
|
}, children: [route.icon, jsxRuntime.jsx("span", { className: "group-[&[data-te-sidenav-slim-collapsed='true']]:data-[te-sidenav-slim='false']:tw-hidden", "data-te-sidenav-slim": 'false', children: route.name }), (location.pathname.includes(route.path) && route.path.length > 1) ||
|
|
3713
3777
|
location.pathname === route.path ? (jsxRuntime.jsx("span", { className: 'tw-absolute tw-inset-y-0 tw-left-0 tw-w-1 tw-rounded-tr-md tw-rounded-br-md tw-bg-primary ', "aria-hidden": 'true' })) : null] })) }, k));
|
|
3714
3778
|
}) }), jsxRuntime.jsx("div", { id: 'slim-toggler', className: 'tw-w-full tw-bg-base-100 tw-flex-1 tw-grid tw-place-items-end', "aria-haspopup": 'true', children: jsxRuntime.jsxs("div", { className: 'tw-w-full', children: [jsxRuntime.jsx("ul", { className: 'tw-menu tw-w-full tw-bg-base-100 tw-text-base-content tw-p-0 tw-mb-0', "data-te-sidenav-menu-ref": true, children: bottomRoutes?.map((route, k) => {
|
|
3715
3779
|
return (jsxRuntime.jsx("li", { className: '', children: route.submenu ? (jsxRuntime.jsx(SidebarSubmenu, { ...route })) : (jsxRuntime.jsxs(reactRouterDom.NavLink, { end: true, target: route.blank ? '_blank' : '_self', to: route.path, className: ({ isActive }) => `${isActive ? 'tw-font-semibold tw-bg-base-200 !tw-rounded-none' : 'tw-font-normal !tw-rounded-none'}`, onClick: () => {
|
|
3716
3780
|
if (screen.width < 640 && !slim)
|
|
3717
|
-
instance
|
|
3781
|
+
instance?.toggle();
|
|
3718
3782
|
}, children: [route.icon, jsxRuntime.jsx("span", { className: "group-[&[data-te-sidenav-slim-collapsed='true']]:data-[te-sidenav-slim='false']:tw-hidden", "data-te-sidenav-slim": 'false', children: route.name }), (location.pathname.includes(route.path) && route.path.length > 1) ||
|
|
3719
3783
|
location.pathname === route.path ? (jsxRuntime.jsx("span", { className: 'tw-absolute tw-inset-y-0 tw-left-0 tw-w-1 tw-rounded-tr-md tw-rounded-br-md tw-bg-primary ', "aria-hidden": 'true' })) : null] })) }, k));
|
|
3720
3784
|
}) }), jsxRuntime.jsx(ChevronRightIcon, { className: 'tw-w-5 tw-h-5 tw-mb-4 tw-mr-4 tw-cursor-pointer tw-float-right tw-delay-400 tw-duration-500 tw-transition-all ' +
|
|
@@ -3732,9 +3796,9 @@ function Content({ children }) {
|
|
|
3732
3796
|
* @category AppShell
|
|
3733
3797
|
*/
|
|
3734
3798
|
const Sitemap = ({ url }) => {
|
|
3735
|
-
const [sitemap, setSitemap] =
|
|
3799
|
+
const [sitemap, setSitemap] = React.useState('');
|
|
3736
3800
|
const items = useItems();
|
|
3737
|
-
|
|
3801
|
+
React.useEffect(() => {
|
|
3738
3802
|
if (items.length) {
|
|
3739
3803
|
const generateSitemap = () => {
|
|
3740
3804
|
let sitemapXML = '<?xml version="1.0" encoding="UTF-8"?>\n';
|
|
@@ -3754,6 +3818,190 @@ const Sitemap = ({ url }) => {
|
|
|
3754
3818
|
return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("h1", { children: "Sitemap" }), jsxRuntime.jsx("textarea", { value: sitemap, readOnly: true, rows: items.length + 4, cols: 80 })] }));
|
|
3755
3819
|
};
|
|
3756
3820
|
|
|
3821
|
+
/**
|
|
3822
|
+
* @category Templates
|
|
3823
|
+
*/
|
|
3824
|
+
function MapOverlayPage({ children, className, backdrop, card = true, }) {
|
|
3825
|
+
const closeScreen = () => {
|
|
3826
|
+
navigate(`/${window.location.search ? window.location.search : ''}`);
|
|
3827
|
+
};
|
|
3828
|
+
const navigate = reactRouterDom.useNavigate();
|
|
3829
|
+
const overlayRef = React.createRef();
|
|
3830
|
+
const backdropRef = React.createRef();
|
|
3831
|
+
React.useEffect(() => {
|
|
3832
|
+
if (overlayRef.current !== null) {
|
|
3833
|
+
leaflet.DomEvent.disableClickPropagation(overlayRef.current);
|
|
3834
|
+
leaflet.DomEvent.disableScrollPropagation(overlayRef.current);
|
|
3835
|
+
}
|
|
3836
|
+
if (backdropRef.current !== null && backdrop) {
|
|
3837
|
+
leaflet.DomEvent.disableClickPropagation(backdropRef.current);
|
|
3838
|
+
leaflet.DomEvent.disableScrollPropagation(backdropRef.current);
|
|
3839
|
+
}
|
|
3840
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3841
|
+
}, [overlayRef, backdropRef]);
|
|
3842
|
+
return (jsxRuntime.jsx("div", { className: `tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop && 'tw-z-[2000]'}`, children: jsxRuntime.jsx("div", { ref: backdropRef, className: `${backdrop && 'tw-backdrop-brightness-75'} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`, children: jsxRuntime.jsxs("div", { ref: overlayRef, className: `${card && 'tw-card tw-card-body'} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && 'tw-z-[2000]'} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`, children: [children, jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2', onClick: () => closeScreen(), children: "\u2715" })] }) }) }));
|
|
3843
|
+
}
|
|
3844
|
+
|
|
3845
|
+
/**
|
|
3846
|
+
* @category Auth
|
|
3847
|
+
*/
|
|
3848
|
+
function LoginPage() {
|
|
3849
|
+
const [email, setEmail] = React.useState('');
|
|
3850
|
+
const [password, setPassword] = React.useState('');
|
|
3851
|
+
const { login, loading } = useAuth();
|
|
3852
|
+
const navigate = reactRouterDom.useNavigate();
|
|
3853
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3854
|
+
const onLogin = async () => {
|
|
3855
|
+
await reactToastify.toast.promise(login({ email, password }), {
|
|
3856
|
+
success: {
|
|
3857
|
+
render({ data }) {
|
|
3858
|
+
navigate('/');
|
|
3859
|
+
return `Hi ${data?.first_name ? data.first_name : 'Traveler'}`;
|
|
3860
|
+
},
|
|
3861
|
+
// other options
|
|
3862
|
+
icon: '✌️',
|
|
3863
|
+
},
|
|
3864
|
+
error: {
|
|
3865
|
+
render({ data }) {
|
|
3866
|
+
return `${data}`;
|
|
3867
|
+
},
|
|
3868
|
+
autoClose: 10000,
|
|
3869
|
+
},
|
|
3870
|
+
pending: 'logging in ...',
|
|
3871
|
+
});
|
|
3872
|
+
};
|
|
3873
|
+
React.useEffect(() => {
|
|
3874
|
+
const keyDownHandler = (event) => {
|
|
3875
|
+
if (event.key === 'Enter') {
|
|
3876
|
+
event.preventDefault();
|
|
3877
|
+
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
3878
|
+
onLogin();
|
|
3879
|
+
}
|
|
3880
|
+
};
|
|
3881
|
+
document.addEventListener('keydown', keyDownHandler);
|
|
3882
|
+
return () => {
|
|
3883
|
+
document.removeEventListener('keydown', keyDownHandler);
|
|
3884
|
+
};
|
|
3885
|
+
}, [onLogin]);
|
|
3886
|
+
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Login" }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-text-right tw-text-primary', children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/reset-password', children: jsxRuntime.jsx("span", { className: 'tw-text-sm tw-inline-block hover:tw-text-primary hover:tw-underline hover:tw-cursor-pointer tw-transition tw-duration-200', children: "Forgot Password?" }) }) }), jsxRuntime.jsx("div", { className: 'tw-card-actions', children: jsxRuntime.jsx("button", { className: loading
|
|
3887
|
+
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
3888
|
+
: 'tw-btn tw-btn-primary tw-btn-block',
|
|
3889
|
+
// eslint-disable-next-line @typescript-eslint/no-misused-promises
|
|
3890
|
+
onClick: () => onLogin(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Login' }) })] }));
|
|
3891
|
+
}
|
|
3892
|
+
|
|
3893
|
+
/**
|
|
3894
|
+
* @category Auth
|
|
3895
|
+
*/
|
|
3896
|
+
function SignupPage() {
|
|
3897
|
+
const [email, setEmail] = React.useState('');
|
|
3898
|
+
const [userName, setUserName] = React.useState('');
|
|
3899
|
+
const [password, setPassword] = React.useState('');
|
|
3900
|
+
const { register, loading } = useAuth();
|
|
3901
|
+
const navigate = reactRouterDom.useNavigate();
|
|
3902
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3903
|
+
const onRegister = async () => {
|
|
3904
|
+
await reactToastify.toast.promise(register({ email, password }, userName), {
|
|
3905
|
+
success: {
|
|
3906
|
+
render({ data }) {
|
|
3907
|
+
navigate('/');
|
|
3908
|
+
return `Hi ${data?.first_name ? data.first_name : 'Traveler'}`;
|
|
3909
|
+
},
|
|
3910
|
+
// other options
|
|
3911
|
+
icon: '✌️',
|
|
3912
|
+
},
|
|
3913
|
+
error: {
|
|
3914
|
+
render({ data }) {
|
|
3915
|
+
return `${data}`;
|
|
3916
|
+
},
|
|
3917
|
+
autoClose: 10000,
|
|
3918
|
+
},
|
|
3919
|
+
pending: 'creating new user ...',
|
|
3920
|
+
});
|
|
3921
|
+
};
|
|
3922
|
+
React.useEffect(() => {
|
|
3923
|
+
const keyDownHandler = (event) => {
|
|
3924
|
+
if (event.key === 'Enter') {
|
|
3925
|
+
event.preventDefault();
|
|
3926
|
+
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
3927
|
+
onRegister();
|
|
3928
|
+
}
|
|
3929
|
+
};
|
|
3930
|
+
document.addEventListener('keydown', keyDownHandler);
|
|
3931
|
+
return () => {
|
|
3932
|
+
document.removeEventListener('keydown', keyDownHandler);
|
|
3933
|
+
};
|
|
3934
|
+
}, [onRegister]);
|
|
3935
|
+
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Sign Up" }), jsxRuntime.jsx("input", { type: 'text', placeholder: 'Name', value: userName, onChange: (e) => setUserName(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
3936
|
+
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
3937
|
+
: 'tw-btn tw-btn-primary tw-btn-block',
|
|
3938
|
+
// eslint-disable-next-line @typescript-eslint/no-misused-promises
|
|
3939
|
+
onClick: () => onRegister(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Sign Up' }) })] }));
|
|
3940
|
+
}
|
|
3941
|
+
|
|
3942
|
+
/**
|
|
3943
|
+
* @category Auth
|
|
3944
|
+
*/
|
|
3945
|
+
function RequestPasswordPage({ resetUrl }) {
|
|
3946
|
+
const [email, setEmail] = React.useState('');
|
|
3947
|
+
const { requestPasswordReset, loading } = useAuth();
|
|
3948
|
+
const navigate = reactRouterDom.useNavigate();
|
|
3949
|
+
const onReset = async () => {
|
|
3950
|
+
await reactToastify.toast.promise(requestPasswordReset(email, resetUrl), {
|
|
3951
|
+
success: {
|
|
3952
|
+
render() {
|
|
3953
|
+
navigate('/');
|
|
3954
|
+
return 'Check your mailbox';
|
|
3955
|
+
},
|
|
3956
|
+
// other options
|
|
3957
|
+
icon: '📬',
|
|
3958
|
+
},
|
|
3959
|
+
error: {
|
|
3960
|
+
render({ data }) {
|
|
3961
|
+
return `${data}`;
|
|
3962
|
+
},
|
|
3963
|
+
},
|
|
3964
|
+
pending: 'sending email ...',
|
|
3965
|
+
});
|
|
3966
|
+
};
|
|
3967
|
+
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Reset Password" }), jsxRuntime.jsx("input", { type: 'email', placeholder: 'E-Mail', value: email, onChange: (e) => setEmail(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
3968
|
+
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
3969
|
+
: 'tw-btn tw-btn-primary tw-btn-block',
|
|
3970
|
+
// eslint-disable-next-line @typescript-eslint/no-misused-promises
|
|
3971
|
+
onClick: () => onReset(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Send' }) })] }));
|
|
3972
|
+
}
|
|
3973
|
+
|
|
3974
|
+
/**
|
|
3975
|
+
* @category Auth
|
|
3976
|
+
*/
|
|
3977
|
+
function SetNewPasswordPage() {
|
|
3978
|
+
const [password, setPassword] = React.useState('');
|
|
3979
|
+
const { passwordReset, loading } = useAuth();
|
|
3980
|
+
const navigate = reactRouterDom.useNavigate();
|
|
3981
|
+
const onReset = async () => {
|
|
3982
|
+
const token = window.location.search.split('token=')[1];
|
|
3983
|
+
await reactToastify.toast.promise(passwordReset(token, password), {
|
|
3984
|
+
success: {
|
|
3985
|
+
render() {
|
|
3986
|
+
navigate('/');
|
|
3987
|
+
return 'New password set';
|
|
3988
|
+
},
|
|
3989
|
+
},
|
|
3990
|
+
error: {
|
|
3991
|
+
render({ data }) {
|
|
3992
|
+
return `${data}`;
|
|
3993
|
+
},
|
|
3994
|
+
},
|
|
3995
|
+
pending: 'setting password ...',
|
|
3996
|
+
});
|
|
3997
|
+
};
|
|
3998
|
+
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-max-w-xs tw-h-fit', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: "Set new Password" }), jsxRuntime.jsx("input", { type: 'password', placeholder: 'Password', onChange: (e) => setPassword(e.target.value), className: 'tw-input tw-input-bordered tw-w-full tw-max-w-xs' }), jsxRuntime.jsx("div", { className: 'tw-card-actions tw-mt-4', children: jsxRuntime.jsx("button", { className: loading
|
|
3999
|
+
? 'tw-btn tw-btn-disabled tw-btn-block tw-btn-primary'
|
|
4000
|
+
: 'tw-btn tw-btn-primary tw-btn-block',
|
|
4001
|
+
// eslint-disable-next-line @typescript-eslint/no-misused-promises
|
|
4002
|
+
onClick: () => onReset(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Set' }) })] }));
|
|
4003
|
+
}
|
|
4004
|
+
|
|
3757
4005
|
function Subtitle({ styleClass, children }) {
|
|
3758
4006
|
return jsxRuntime.jsx("div", { className: `tw-text-xl tw-font-semibold ${styleClass}`, children: children });
|
|
3759
4007
|
}
|
|
@@ -3803,8 +4051,8 @@ const getLastNewMoon = (date = new Date()) => {
|
|
|
3803
4051
|
};
|
|
3804
4052
|
|
|
3805
4053
|
const CircleLayout = ({ items, radius, fontSize, }) => {
|
|
3806
|
-
const containerRef =
|
|
3807
|
-
|
|
4054
|
+
const containerRef = React.useRef(null);
|
|
4055
|
+
React.useEffect(() => {
|
|
3808
4056
|
const container = containerRef.current;
|
|
3809
4057
|
const itemCount = items.length;
|
|
3810
4058
|
if (container) {
|
|
@@ -3828,7 +4076,7 @@ const CircleLayout = ({ items, radius, fontSize, }) => {
|
|
|
3828
4076
|
*/
|
|
3829
4077
|
const MoonCalendar = () => {
|
|
3830
4078
|
const today = dateFns.startOfToday();
|
|
3831
|
-
const [currMonth, setCurrMonth] =
|
|
4079
|
+
const [currMonth, setCurrMonth] = React.useState(() => dateFns.format(today, 'MMM-yyyy'));
|
|
3832
4080
|
const firstDayOfMonth = dateFns.parse(currMonth, 'MMM-yyyy', new Date());
|
|
3833
4081
|
const getPrevMonth = (event) => {
|
|
3834
4082
|
event.preventDefault();
|
|
@@ -3854,22 +4102,47 @@ const MoonCalendar = () => {
|
|
|
3854
4102
|
const SelectUser = () => {
|
|
3855
4103
|
const appState = useAppState();
|
|
3856
4104
|
const items = useItems();
|
|
3857
|
-
const users = items.filter((i) => i.layer?.
|
|
3858
|
-
const [selectedUsers, setSelectedUsers] =
|
|
4105
|
+
const users = items.filter((i) => i.layer?.userProfileLayer);
|
|
4106
|
+
const [selectedUsers, setSelectedUsers] = React.useState([]);
|
|
3859
4107
|
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-h-3/4 tw-w-80', children: [jsxRuntime.jsx("div", { className: 'tw-text-center tw-text-xl tw-font-bold tw-mb-4', children: "Gratitude to ..." }), jsxRuntime.jsx("div", { className: 'tw-overflow-x-auto tw-w-full fade', children: jsxRuntime.jsx("table", { className: 'tw-table tw-w-full', children: jsxRuntime.jsx("tbody", { children: users.map((u, k) => {
|
|
3860
4108
|
return (jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsx("td", { children: jsxRuntime.jsx("input", { type: 'checkbox', onChange: () => setSelectedUsers((prev) => [...prev, u.id]), className: 'tw-checkbox tw-checkbox-sm' }) }), jsxRuntime.jsx("td", { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-items-center tw-space-x-3', children: [u.image ? (jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-mask tw-mask-circle tw-w-8 tw-h-8', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url + u.image + '?width=40&heigth=40', alt: 'Avatar' }) }) })) : (jsxRuntime.jsx("div", { className: 'tw-mask tw-mask-circle tw-text-xl md:tw-text-2xl tw-bg-slate-200 tw-rounded-full tw-w-8 tw-h-8' })), jsxRuntime.jsx("div", { children: jsxRuntime.jsx("div", { className: 'tw-font-bold', children: u.name }) })] }) })] }, k));
|
|
3861
4109
|
}) }) }) }), jsxRuntime.jsx("div", { className: 'tw-w-full tw-grid tw-mt-4', children: jsxRuntime.jsx(reactRouterDom.Link, { className: 'tw-place-self-center ', to: '/attestation-form' + '?to=' + selectedUsers.map((u) => u, ','), children: jsxRuntime.jsx("button", { className: 'tw-btn tw-px-8', children: "Next" }) }) })] }));
|
|
3862
4110
|
};
|
|
3863
4111
|
|
|
4112
|
+
function PlusIcon({
|
|
4113
|
+
title,
|
|
4114
|
+
titleId,
|
|
4115
|
+
...props
|
|
4116
|
+
}, svgRef) {
|
|
4117
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
4118
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4119
|
+
fill: "none",
|
|
4120
|
+
viewBox: "0 0 24 24",
|
|
4121
|
+
strokeWidth: 1.5,
|
|
4122
|
+
stroke: "currentColor",
|
|
4123
|
+
"aria-hidden": "true",
|
|
4124
|
+
"data-slot": "icon",
|
|
4125
|
+
ref: svgRef,
|
|
4126
|
+
"aria-labelledby": titleId
|
|
4127
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
4128
|
+
id: titleId
|
|
4129
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
4130
|
+
strokeLinecap: "round",
|
|
4131
|
+
strokeLinejoin: "round",
|
|
4132
|
+
d: "M12 4.5v15m7.5-7.5h-15"
|
|
4133
|
+
}));
|
|
4134
|
+
}
|
|
4135
|
+
const ForwardRef$5 = /*#__PURE__*/ React__namespace.forwardRef(PlusIcon);
|
|
4136
|
+
|
|
3864
4137
|
function PlusButton({ layer, triggerAction, color, collection = 'items', }) {
|
|
3865
4138
|
const hasUserPermission = useHasUserPermission();
|
|
3866
4139
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: hasUserPermission(collection, 'create', undefined, layer) && (jsxRuntime.jsx("div", { className: 'tw-dropdown tw-dropdown-top tw-dropdown-end tw-dropdown-hover tw-z-3000 tw-absolute tw-right-4 tw-bottom-4', children: jsxRuntime.jsx("button", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow', onClick: () => {
|
|
3867
4140
|
triggerAction();
|
|
3868
|
-
}, style: { backgroundColor: color, color: '#fff' }, children: jsxRuntime.jsx(
|
|
4141
|
+
}, style: { backgroundColor: color, color: '#fff' }, children: jsxRuntime.jsx(ForwardRef$5, { className: 'tw-w-5 tw-h-5 tw-stroke-[2.5]' }) }) })) }));
|
|
3869
4142
|
}
|
|
3870
4143
|
|
|
3871
4144
|
const DateUserInfo = ({ item }) => {
|
|
3872
|
-
const [infoExpanded, setInfoExpanded] =
|
|
4145
|
+
const [infoExpanded, setInfoExpanded] = React.useState(false);
|
|
3873
4146
|
return (jsxRuntime.jsxs("div", { className: 'tw-flex -tw-mb-1 tw-flex-row tw-mr-2 -tw-mt-2', onClick: (e) => e.stopPropagation(), children: [infoExpanded ? (jsxRuntime.jsx("p", { className: 'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500', onClick: () => setInfoExpanded(false), children: `${item.date_updated && item.date_updated !== item.date_created ? 'updated' : 'posted'} ${item && item.user_created && item.user_created.first_name ? `by ${item.user_created.first_name}` : ''} ${item.date_updated ? timeAgo(item.date_updated) : timeAgo(item.date_created)}` })) : (jsxRuntime.jsx("p", { className: '!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500', onClick: () => setInfoExpanded(true), children: "\u24D8" })), jsxRuntime.jsx("div", { className: 'tw-grow ' })] }));
|
|
3874
4147
|
};
|
|
3875
4148
|
|
|
@@ -3890,16 +4163,16 @@ const ItemCard = ({ i, loading, url, deleteCallback, }) => {
|
|
|
3890
4163
|
* @category Templates
|
|
3891
4164
|
*/
|
|
3892
4165
|
const OverlayItemsIndexPage = ({ url, layerName, parameterField, plusButton = true, }) => {
|
|
3893
|
-
const [loading, setLoading] =
|
|
3894
|
-
const [addItemPopupType, setAddItemPopupType] =
|
|
3895
|
-
const tabRef =
|
|
4166
|
+
const [loading, setLoading] = React.useState(false);
|
|
4167
|
+
const [addItemPopupType, setAddItemPopupType] = React.useState('');
|
|
4168
|
+
const tabRef = React.useRef(null);
|
|
3896
4169
|
function scroll() {
|
|
3897
4170
|
tabRef.current?.scrollIntoView();
|
|
3898
4171
|
}
|
|
3899
|
-
|
|
4172
|
+
React.useEffect(() => {
|
|
3900
4173
|
scroll();
|
|
3901
4174
|
}, [addItemPopupType]);
|
|
3902
|
-
|
|
4175
|
+
React.useEffect(() => {
|
|
3903
4176
|
setAddItemPopupType('');
|
|
3904
4177
|
}, [layerName]);
|
|
3905
4178
|
const tags = useTags();
|
|
@@ -3993,7 +4266,7 @@ const OverlayItemsIndexPage = ({ url, layerName, parameterField, plusButton = tr
|
|
|
3993
4266
|
};
|
|
3994
4267
|
|
|
3995
4268
|
const EmojiPicker = ({ selectedEmoji, selectedColor, selectedShape, setSelectedEmoji, setSelectedColor, setSelectedShape, }) => {
|
|
3996
|
-
const [isOpen, setIsOpen] =
|
|
4269
|
+
const [isOpen, setIsOpen] = React.useState(false);
|
|
3997
4270
|
const emojis = [
|
|
3998
4271
|
'❤️',
|
|
3999
4272
|
'🙏',
|
|
@@ -4071,17 +4344,17 @@ const EmojiPicker = ({ selectedEmoji, selectedColor, selectedShape, setSelectedE
|
|
|
4071
4344
|
const AttestationForm = ({ api }) => {
|
|
4072
4345
|
const items = useItems();
|
|
4073
4346
|
const appState = useAppState();
|
|
4074
|
-
const [users, setUsers] =
|
|
4347
|
+
const [users, setUsers] = React.useState();
|
|
4075
4348
|
const navigate = reactRouterDom.useNavigate();
|
|
4076
|
-
|
|
4349
|
+
React.useEffect(() => {
|
|
4077
4350
|
const params = new URLSearchParams(location.search);
|
|
4078
4351
|
const toUserIds = params.get('to');
|
|
4079
4352
|
setUsers(items.filter((i) => toUserIds?.includes(i.id)));
|
|
4080
4353
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4081
4354
|
}, [items, location]);
|
|
4082
|
-
const [inputValue, setInputValue] =
|
|
4083
|
-
const inputRef =
|
|
4084
|
-
|
|
4355
|
+
const [inputValue, setInputValue] = React.useState('');
|
|
4356
|
+
const inputRef = React.useRef(null);
|
|
4357
|
+
React.useEffect(() => {
|
|
4085
4358
|
if (inputRef.current) {
|
|
4086
4359
|
inputRef.current.style.width = 'auto';
|
|
4087
4360
|
inputRef.current.style.width = `${inputRef.current.scrollWidth + 20}px`;
|
|
@@ -4118,12 +4391,12 @@ const AttestationForm = ({ api }) => {
|
|
|
4118
4391
|
items.find((i) =>
|
|
4119
4392
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
4120
4393
|
i.user_created?.id === to[0].directus_users_id &&
|
|
4121
|
-
i.layer?.
|
|
4394
|
+
i.layer?.userProfileLayer === true)?.id +
|
|
4122
4395
|
'?tab=2'));
|
|
4123
4396
|
};
|
|
4124
|
-
const [selectedEmoji, setSelectedEmoji] =
|
|
4125
|
-
const [selectedShape, setSelectedShape] =
|
|
4126
|
-
const [selectedColor, setSelectedColor] =
|
|
4397
|
+
const [selectedEmoji, setSelectedEmoji] = React.useState('select badge');
|
|
4398
|
+
const [selectedShape, setSelectedShape] = React.useState('circle');
|
|
4399
|
+
const [selectedColor, setSelectedColor] = React.useState('#fff0d6');
|
|
4127
4400
|
return (jsxRuntime.jsxs(MapOverlayPage, { backdrop: true, className: 'tw-h-fit tw-min-h-56 tw-w-96', children: [jsxRuntime.jsx("div", { className: 'tw-text-center tw-text-xl tw-font-bold', children: "Gratitude" }), jsxRuntime.jsx("div", { className: 'tw-text-center tw-text-base tw-text-gray-400', children: "to" }), jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-row tw-justify-center tw-items-center tw-flex-wrap', children: users?.map((u, k) => (jsxRuntime.jsxs("div", { className: 'tw-flex tw-items-center tw-space-x-3 tw-mx-2 tw-my-1', children: [u.image ? (jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-mask tw-mask-circle tw-w-8 tw-h-8', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url + u.image + '?width=40&heigth=40', alt: 'Avatar' }) }) })) : (jsxRuntime.jsx("div", { className: 'tw-mask tw-mask-circle tw-text-xl md:tw-text-2xl tw-bg-slate-200 tw-rounded-full tw-w-8 tw-h-8' })), jsxRuntime.jsx("div", { children: jsxRuntime.jsx("div", { className: 'tw-font-bold', children: u.name }) })] }, k)), ', ') }), jsxRuntime.jsxs("div", { className: 'tw-w-full', children: [jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center tw-items-center', children: jsxRuntime.jsx("div", { className: ' tw-flex tw-justify-center tw-items-center tw-w-28 tw-h-28 tw-m-4', children: jsxRuntime.jsx(EmojiPicker, { selectedEmoji: selectedEmoji, selectedColor: selectedColor, selectedShape: selectedShape, setSelectedEmoji: setSelectedEmoji, setSelectedColor: setSelectedColor, setSelectedShape: setSelectedShape }) }) }), jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center tw-items-center', children: jsxRuntime.jsx("input", { ref: inputRef, value: inputValue, onChange: handleChange, type: 'text', placeholder: '... and say some words', className: 'tw-input tw-min-w-0 tw-w-fit tw-resize-none tw-overflow-hidden tw-text-center ' }) })] }), jsxRuntime.jsx("div", { className: 'tw-w-full tw-grid tw-mt-4', children: jsxRuntime.jsx("button", { onClick: sendAttestation, className: 'tw-btn tw-place-self-center tw-px-8', children: "Next" }) })] }));
|
|
4128
4401
|
};
|
|
4129
4402
|
|
|
@@ -4150,12 +4423,12 @@ function groupAndCount(arr) {
|
|
|
4150
4423
|
* @category Templates
|
|
4151
4424
|
*/
|
|
4152
4425
|
const MarketView = () => {
|
|
4153
|
-
const [offers, setOffers] =
|
|
4154
|
-
const [needs, setNeeds] =
|
|
4426
|
+
const [offers, setOffers] = React.useState([]);
|
|
4427
|
+
const [needs, setNeeds] = React.useState([]);
|
|
4155
4428
|
const navigate = reactRouterDom.useNavigate();
|
|
4156
4429
|
const items = useItems();
|
|
4157
4430
|
const tags = useTags();
|
|
4158
|
-
|
|
4431
|
+
React.useEffect(() => {
|
|
4159
4432
|
setOffers([]);
|
|
4160
4433
|
setNeeds([]);
|
|
4161
4434
|
for (const item of items) {
|
|
@@ -4180,12 +4453,12 @@ const MarketView = () => {
|
|
|
4180
4453
|
*/
|
|
4181
4454
|
function UserSettings() {
|
|
4182
4455
|
const { user, updateUser, loading /* token */ } = useAuth();
|
|
4183
|
-
const [id, setId] =
|
|
4184
|
-
const [email, setEmail] =
|
|
4185
|
-
const [password, setPassword] =
|
|
4186
|
-
const [passwordChanged, setPasswordChanged] =
|
|
4456
|
+
const [id, setId] = React.useState('');
|
|
4457
|
+
const [email, setEmail] = React.useState('');
|
|
4458
|
+
const [password, setPassword] = React.useState('');
|
|
4459
|
+
const [passwordChanged, setPasswordChanged] = React.useState(false);
|
|
4187
4460
|
const navigate = reactRouterDom.useNavigate();
|
|
4188
|
-
|
|
4461
|
+
React.useEffect(() => {
|
|
4189
4462
|
setId(user?.id ? user.id : '');
|
|
4190
4463
|
setEmail(user?.email ? user.email : '');
|
|
4191
4464
|
setPassword(user?.password ? user.password : '');
|
|
@@ -4393,7 +4666,6 @@ const onUpdateItem = async (state, item, tags, addTag, setLoading, navigate, upd
|
|
|
4393
4666
|
...changedItem,
|
|
4394
4667
|
layer: item.layer,
|
|
4395
4668
|
user_created: user,
|
|
4396
|
-
type: item.layer?.itemType,
|
|
4397
4669
|
}))
|
|
4398
4670
|
.then(() => {
|
|
4399
4671
|
setLoading(false);
|
|
@@ -4403,19 +4675,64 @@ const onUpdateItem = async (state, item, tags, addTag, setLoading, navigate, upd
|
|
|
4403
4675
|
}
|
|
4404
4676
|
};
|
|
4405
4677
|
|
|
4678
|
+
function EnvelopeIcon({
|
|
4679
|
+
title,
|
|
4680
|
+
titleId,
|
|
4681
|
+
...props
|
|
4682
|
+
}, svgRef) {
|
|
4683
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
4684
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4685
|
+
fill: "none",
|
|
4686
|
+
viewBox: "0 0 24 24",
|
|
4687
|
+
strokeWidth: 1.5,
|
|
4688
|
+
stroke: "currentColor",
|
|
4689
|
+
"aria-hidden": "true",
|
|
4690
|
+
"data-slot": "icon",
|
|
4691
|
+
ref: svgRef,
|
|
4692
|
+
"aria-labelledby": titleId
|
|
4693
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
4694
|
+
id: titleId
|
|
4695
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
4696
|
+
strokeLinecap: "round",
|
|
4697
|
+
strokeLinejoin: "round",
|
|
4698
|
+
d: "M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"
|
|
4699
|
+
}));
|
|
4700
|
+
}
|
|
4701
|
+
const ForwardRef$4 = /*#__PURE__*/ React__namespace.forwardRef(EnvelopeIcon);
|
|
4702
|
+
|
|
4703
|
+
function PhoneIcon({
|
|
4704
|
+
title,
|
|
4705
|
+
titleId,
|
|
4706
|
+
...props
|
|
4707
|
+
}, svgRef) {
|
|
4708
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
4709
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4710
|
+
fill: "none",
|
|
4711
|
+
viewBox: "0 0 24 24",
|
|
4712
|
+
strokeWidth: 1.5,
|
|
4713
|
+
stroke: "currentColor",
|
|
4714
|
+
"aria-hidden": "true",
|
|
4715
|
+
"data-slot": "icon",
|
|
4716
|
+
ref: svgRef,
|
|
4717
|
+
"aria-labelledby": titleId
|
|
4718
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
4719
|
+
id: titleId
|
|
4720
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
4721
|
+
strokeLinecap: "round",
|
|
4722
|
+
strokeLinejoin: "round",
|
|
4723
|
+
d: "M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z"
|
|
4724
|
+
}));
|
|
4725
|
+
}
|
|
4726
|
+
const ForwardRef$3 = /*#__PURE__*/ React__namespace.forwardRef(PhoneIcon);
|
|
4727
|
+
|
|
4406
4728
|
const ContactInfoView = ({ item, heading }) => {
|
|
4407
4729
|
const appState = useAppState();
|
|
4408
|
-
const [profileOwner, setProfileOwner] =
|
|
4730
|
+
const [profileOwner, setProfileOwner] = React.useState();
|
|
4409
4731
|
const items = useItems();
|
|
4410
|
-
|
|
4411
|
-
|
|
4412
|
-
console.log('user:', items.find((i) => i.user_created?.id === item.user_created?.id &&
|
|
4413
|
-
i.layer?.itemType.name === appState.userType));
|
|
4414
|
-
setProfileOwner(items.find((i) => i.user_created?.id === item.user_created?.id &&
|
|
4415
|
-
i.layer?.itemType.name === appState.userType));
|
|
4416
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4732
|
+
React.useEffect(() => {
|
|
4733
|
+
setProfileOwner(items.find((i) => i.user_created?.id === item.user_created?.id && i.layer?.userProfileLayer));
|
|
4417
4734
|
}, [item, items]);
|
|
4418
|
-
return (jsxRuntime.jsxs("div", { className: 'tw-bg-base-200 tw-mb-6 tw-mt-6 tw-p-6', children: [jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading }), jsxRuntime.jsxs("div", { className: 'tw-mt-4 tw-flex tw-items-center', children: [profileOwner?.image && (jsxRuntime.jsx(ConditionalLink, { url: '/item/' + profileOwner?.id, children: jsxRuntime.jsx("div", { className: 'tw-mr-5 tw-flex tw-items-center tw-justify-center', children: jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-w-20 tw-h-20 tw-bg-gray-200 rounded-full tw-flex tw-items-center tw-justify-center overflow-hidden', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url + profileOwner?.image, alt: profileOwner?.name, className: 'tw-w-full tw-h-full tw-object-cover' }) }) }) }) })), jsxRuntime.jsxs("div", { className: 'tw-text-sm tw-flex-grow', children: [jsxRuntime.jsx("p", { className: 'tw-font-semibold', children: profileOwner?.name }), item.contact && (jsxRuntime.jsx("p", { children: jsxRuntime.jsxs("a", { href: `mailto:${item.contact}`, className: 'tw-mt-2 tw-text-green-500 tw-inline-flex tw-items-center', children: [jsxRuntime.
|
|
4735
|
+
return (jsxRuntime.jsxs("div", { className: 'tw-bg-base-200 tw-mb-6 tw-mt-6 tw-p-6', children: [jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading }), jsxRuntime.jsxs("div", { className: 'tw-mt-4 tw-flex tw-items-center', children: [profileOwner?.image && (jsxRuntime.jsx(ConditionalLink, { url: '/item/' + profileOwner?.id, children: jsxRuntime.jsx("div", { className: 'tw-mr-5 tw-flex tw-items-center tw-justify-center', children: jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-w-20 tw-h-20 tw-bg-gray-200 rounded-full tw-flex tw-items-center tw-justify-center overflow-hidden', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url + profileOwner?.image, alt: profileOwner?.name, className: 'tw-w-full tw-h-full tw-object-cover' }) }) }) }) })), jsxRuntime.jsxs("div", { className: 'tw-text-sm tw-flex-grow', children: [jsxRuntime.jsx("p", { className: 'tw-font-semibold', children: profileOwner?.name }), item.contact && (jsxRuntime.jsx("p", { children: jsxRuntime.jsxs("a", { href: `mailto:${item.contact}`, className: 'tw-mt-2 tw-text-green-500 tw-inline-flex tw-items-center', children: [jsxRuntime.jsx(ForwardRef$4, { className: 'tw-w-4 tw-h-4 tw-mr-1' }), item.contact] }) })), item.telephone && (jsxRuntime.jsx("p", { children: jsxRuntime.jsxs("a", { href: `tel:${item.telephone}`, className: 'tw-mt-2 tw-text-green-500 tw-inline-flex tw-items-center tw-whitespace-nowrap', children: [jsxRuntime.jsx(ForwardRef$3, { className: 'tw-w-4 tw-h-4 tw-mr-1' }), item.telephone] }) }))] })] })] }));
|
|
4419
4736
|
};
|
|
4420
4737
|
// eslint-disable-next-line react/prop-types
|
|
4421
4738
|
const ConditionalLink = ({ url, children }) => {
|
|
@@ -4433,7 +4750,7 @@ var css_248z$1 = ".react-photo-album{display:flex}.react-photo-album,.react-phot
|
|
|
4433
4750
|
styleInject(css_248z$1);
|
|
4434
4751
|
|
|
4435
4752
|
const GalleryView = ({ item }) => {
|
|
4436
|
-
const [index, setIndex] =
|
|
4753
|
+
const [index, setIndex] = React.useState(-1);
|
|
4437
4754
|
const appState = useAppState();
|
|
4438
4755
|
const images = item.gallery?.map((i, j) => {
|
|
4439
4756
|
return {
|
|
@@ -4448,35 +4765,51 @@ const GalleryView = ({ item }) => {
|
|
|
4448
4765
|
return (jsxRuntime.jsxs("div", { className: 'tw-mx-6 tw-mb-6', children: [jsxRuntime.jsx(reactPhotoAlbum.RowsPhotoAlbum, { photos: images, targetRowHeight: 150, onClick: ({ index: current }) => setIndex(current) }), jsxRuntime.jsx(ReactLightbox, { index: index, slides: images, open: index >= 0, close: () => setIndex(-1) })] }));
|
|
4449
4766
|
};
|
|
4450
4767
|
|
|
4768
|
+
var ChevronSVG = 'data:image/svg+xml;base64,PHN2ZwogICAgICAgICAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICAgICAgICAgIHZpZXdCb3g9JzAgMCAyNCAyNCcKICAgICAgICAgICAgZmlsbD0nd2hpdGUnCiAgICAgICAgICAgIGNsYXNzTmFtZT0ndHctaC00IHR3LXctNCcKICAgICAgICAgID4KICAgICAgICAgICAgPHBhdGggZD0nTTIwIDRINGMtMS4xIDAtMS45OS45LTEuOTkgMkwyIDE4YzAgMS4xLjkgMiAyIDJoMTZjMS4xIDAgMi0uOSAyLTJWNmMwLTEuMS0uOS0yLTItMnptMCA0bC04IDUtOC01VjZsOCA1IDgtNXYyeicgLz4KICAgICAgICAgIDwvc3ZnPg==';
|
|
4769
|
+
|
|
4770
|
+
var ClipboardSVG = 'data:image/svg+xml;base64,PHN2ZyBzdHJva2U9ImN1cnJlbnRDb2xvciIgZmlsbD0id2hpdGUiIHN0cm9rZS13aWR0aD0iMCIgdmlld0JveD0iMCAwIDI1NiAyNTYiIGhlaWdodD0iMS41ZW0iIHdpZHRoPSIxLjVlbSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTgwLDY0SDQwQTEyLDEyLDAsMCwwLDI4LDc2VjIxNmExMiwxMiwwLDAsMCwxMiwxMkgxODBhMTIsMTIsMCwwLDAsMTItMTJWNzZBMTIsMTIsMCwwLDAsMTgwLDY0Wk0xNjgsMjA0SDUyVjg4SDE2OFpNMjI4LDQwVjE4MGExMiwxMiwwLDAsMS0yNCwwVjUySDc2YTEyLDEyLDAsMCwxLDAtMjRIMjE2QTEyLDEyLDAsMCwxLDIyOCw0MFoiPjwvcGF0aD48L3N2Zz4=';
|
|
4771
|
+
|
|
4772
|
+
var FacebookSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nd2hpdGUnPgogICAgICAgIDxwYXRoIGQ9J00xOCAyaC0zYTUgNSAwIDAwLTUgNXYzSDd2NGgzdjhoNHYtOGgzbDEtNGgtNFY3YTEgMSAwIDAxMS0xaDN6JyAvPgogICAgICA8L3N2Zz4=';
|
|
4773
|
+
|
|
4774
|
+
var LinkedinSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nd2hpdGUnPgogICAgICAgIDxwYXRoIGQ9J00xNiA4YTYgNiAwIDAxNiA2djdoLTR2LTdhMiAyIDAgMDAtMi0yIDIgMiAwIDAwLTIgMnY3aC00di03YTYgNiAwIDAxNi02ek0yIDloNHYxMkgyeicgLz4KICAgICAgICA8Y2lyY2xlIGN4PSc0JyBjeT0nNCcgcj0nMicgLz4KICAgICAgPC9zdmc+';
|
|
4775
|
+
|
|
4776
|
+
var TelegramSVG = 'data:image/svg+xml;base64,PHN2ZwogICAgICAgIHN0cm9rZT0nd2hpdGUnCiAgICAgICAgZmlsbD0nd2hpdGUnCiAgICAgICAgc3Ryb2tlV2lkdGg9JzAnCiAgICAgICAgdmlld0JveD0nMCAwIDQ0OCA1MTInCiAgICAgICAgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJwogICAgICA+CiAgICAgICAgPHBhdGggZD0nTTQ0Ni43IDk4LjZsLTY3LjYgMzE4LjhjLTUuMSAyMi41LTE4LjQgMjguMS0zNy4zIDE3LjVsLTEwMy03NS45LTQ5LjcgNDcuOGMtNS41IDUuNS0xMC4xIDEwLjEtMjAuNyAxMC4xbDcuNC0xMDQuOSAxOTAuOS0xNzIuNWM4LjMtNy40LTEuOC0xMS41LTEyLjktNC4xTDExNy44IDI4NCAxNi4yIDI1Mi4yYy0yMi4xLTYuOS0yMi41LTIyLjEgNC42LTMyLjdMNDE4LjIgNjYuNGMxOC40LTYuOSAzNC41IDQuMSAyOC41IDMyLjJ6Jz48L3BhdGg+CiAgICAgIDwvc3ZnPg==';
|
|
4777
|
+
|
|
4778
|
+
var TwitterSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nd2hpdGUnPgogICAgICAgIDxwYXRoIGQ9J00yMyAzYTEwLjkgMTAuOSAwIDAxLTMuMTQgMS41MyA0LjQ4IDQuNDggMCAwMC03Ljg2IDN2MUExMC42NiAxMC42NiAwIDAxMyA0cy00IDkgNSAxM2ExMS42NCAxMS42NCAwIDAxLTcgMmM5IDUgMjAgMCAyMC0xMS41YTQuNSA0LjUgMCAwMC0uMDgtLjgzQTcuNzIgNy43MiAwIDAwMjMgM3onIC8+CiAgICAgIDwvc3ZnPg==';
|
|
4779
|
+
|
|
4780
|
+
var WhatsappSVG = 'data:image/svg+xml;base64,PHN2ZwogICAgICAgIHN0cm9rZT0nY3VycmVudENvbG9yJwogICAgICAgIGZpbGw9J3doaXRlJwogICAgICAgIHN0cm9rZVdpZHRoPScwJwogICAgICAgIHZpZXdCb3g9JzAgMCA1MTIgNTEyJwogICAgICAgIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZycKICAgICAgPgogICAgICAgIDxwYXRoIGQ9J000OTcuMzkgMzYxLjhsLTExMi00OGEyNCAyNCAwIDAgMC0yOCA2LjlsLTQ5LjYgNjAuNkEzNzAuNjYgMzcwLjY2IDAgMCAxIDEzMC42IDIwNC4xMWw2MC42LTQ5LjZhMjMuOTQgMjMuOTQgMCAwIDAgNi45LTI4bC00OC0xMTJBMjQuMTYgMjQuMTYgMCAwIDAgMTIyLjYuNjFsLTEwNCAyNEEyNCAyNCAwIDAgMCAwIDQ4YzAgMjU2LjUgMjA3LjkgNDY0IDQ2NCA0NjRhMjQgMjQgMCAwIDAgMjMuNC0xOC42bDI0LTEwNGEyNC4yOSAyNC4yOSAwIDAgMC0xNC4wMS0yNy42eic+PC9wYXRoPgogICAgICA8L3N2Zz4=';
|
|
4781
|
+
|
|
4782
|
+
var XingSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nd2hpdGUnPgogICAgICAgIDxwYXRoIGQ9J00xOC4xODggMGMtLjUxNyAwLS43NDEuMzI1LS45MjcuNjYgMCAwLTcuNDU1IDEzLjIyNC03LjcwMiAxMy42NTcuMDE1LjAyNCA0LjkxOSA5LjAyMyA0LjkxOSA5LjAyMy4xNy4zMDguNDM2LjY2Ljk2Ny42NmgzLjQ1NGMuMjExIDAgLjM3NS0uMDc4LjQ2My0uMjIuMDg5LS4xNTEuMDg5LS4zNDYtLjAwOS0uNTM2bC00Ljg3OS04LjkxNmMtLjAwNC0uMDA2LS4wMDQtLjAxNiAwLS4wMjJMMjIuMTM5Ljc1NmMuMDk1LS4xOTEuMDk3LS4zODcuMDA2LS41MzVDMjIuMDU2LjA3OCAyMS44OTQgMCAyMS42ODYgMGgtMy40OTh6TTMuNjQ4IDQuNzRjLS4yMTEgMC0uMzg1LjA3NC0uNDczLjIxNi0uMDkuMTQ5LS4wNzguMzM5LjAyLjUzMWwyLjM0IDQuMDVjLjAwNC4wMS4wMDQuMDE2IDAgLjAyMUwxLjg2IDE2LjA1MWMtLjA5OS4xODgtLjA5My4zODEgMCAuNTI5LjA4NS4xNDIuMjM5LjIzNC40NS4yMzRoMy40NjFjLjUxOCAwIC43NjYtLjM0OC45NDUtLjY2N2wzLjczNC02LjYwOS0yLjM3OC00LjE1NWMtLjE3Mi0uMzE1LS40MzQtLjY1OS0uOTYyLS42NTlIMy42NDh2LjAxNnonIC8+CiAgICAgIDwvc3ZnPg==';
|
|
4783
|
+
|
|
4451
4784
|
const platformConfigs = {
|
|
4452
4785
|
facebook: {
|
|
4453
4786
|
shareUrl: 'https://www.facebook.com/sharer/sharer.php?u={url}',
|
|
4454
|
-
icon:
|
|
4787
|
+
icon: jsxRuntime.jsx("img", { src: FacebookSVG, alt: 'Facebook' }),
|
|
4455
4788
|
bgColor: '#3b5998',
|
|
4456
4789
|
},
|
|
4457
4790
|
twitter: {
|
|
4458
4791
|
shareUrl: 'https://twitter.com/intent/tweet?text={title}:%20{url}',
|
|
4459
|
-
icon:
|
|
4792
|
+
icon: jsxRuntime.jsx("img", { src: TwitterSVG, alt: 'Twitter' }),
|
|
4460
4793
|
bgColor: '#55acee',
|
|
4461
4794
|
},
|
|
4462
4795
|
linkedin: {
|
|
4463
4796
|
shareUrl: 'http://www.linkedin.com/shareArticle?mini=true&url={url}&title={title}',
|
|
4464
|
-
icon:
|
|
4797
|
+
icon: jsxRuntime.jsx("img", { src: LinkedinSVG, alt: 'Linkedin' }),
|
|
4465
4798
|
bgColor: '#4875b4',
|
|
4466
4799
|
},
|
|
4467
4800
|
xing: {
|
|
4468
4801
|
shareUrl: 'https://www.xing-share.com/app/user?op=share;sc_p=xing-share;url={url}',
|
|
4469
|
-
icon:
|
|
4802
|
+
icon: jsxRuntime.jsx("img", { src: XingSVG, alt: 'Xing' }),
|
|
4470
4803
|
bgColor: '#026466',
|
|
4471
4804
|
},
|
|
4472
4805
|
whatsapp: {
|
|
4473
4806
|
shareUrl: 'https://api.whatsapp.com/send?text={title}%20{url}',
|
|
4474
|
-
icon:
|
|
4807
|
+
icon: jsxRuntime.jsx("img", { src: WhatsappSVG, alt: 'Whatsapp' }),
|
|
4475
4808
|
bgColor: '#25D366',
|
|
4476
4809
|
},
|
|
4477
4810
|
telegram: {
|
|
4478
4811
|
shareUrl: 'https://t.me/share/url?url={url}&text={title}',
|
|
4479
|
-
icon:
|
|
4812
|
+
icon: jsxRuntime.jsx("img", { src: TelegramSVG, alt: 'Telegram' }),
|
|
4480
4813
|
bgColor: '#0088cc',
|
|
4481
4814
|
},
|
|
4482
4815
|
};
|
|
@@ -4493,7 +4826,7 @@ const SocialShareButton = ({ platform, url, title, }) => {
|
|
|
4493
4826
|
return (jsxRuntime.jsx("a", { href: finalShareUrl, target: '_blank', rel: 'noopener noreferrer', className: 'tw-w-8 tw-h-8 tw-mt-2 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-text-white', style: {
|
|
4494
4827
|
color: 'white',
|
|
4495
4828
|
backgroundColor: bgColor,
|
|
4496
|
-
}, title: `share link on ${platform}`, children:
|
|
4829
|
+
}, title: `share link on ${platform}`, children: React.cloneElement(icon, { className: 'tw-w-4 tw-h-4 tw-fill-current' }) }));
|
|
4497
4830
|
};
|
|
4498
4831
|
|
|
4499
4832
|
const SocialShareBar = ({ url, title, platforms = ['facebook', 'twitter', 'linkedin', 'xing', 'email'], }) => {
|
|
@@ -4512,10 +4845,10 @@ const SocialShareBar = ({ url, title, platforms = ['facebook', 'twitter', 'linke
|
|
|
4512
4845
|
return (jsxRuntime.jsxs("div", { className: 'tw-flex tw-place-content-end tw-justify-end tw-space-x-2 tw-grow tw-min-w-fit tw-pl-2', children: [platforms.map((platform) => (jsxRuntime.jsx(SocialShareButton, { platform: platform, url: url, title: title }, platform))), platforms.includes('email') && (jsxRuntime.jsx("a", { href: `mailto:?subject=${title}&body=${url}`, target: '_blank', rel: 'noopener noreferrer', className: 'tw-w-8 tw-h-8 tw-mt-2 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-text-white hover:tw-cursor-pointer', style: {
|
|
4513
4846
|
color: 'white',
|
|
4514
4847
|
backgroundColor: '#444',
|
|
4515
|
-
}, onClick: () => copyLink(), title: 'share link via email', children: jsxRuntime.jsx("
|
|
4848
|
+
}, onClick: () => copyLink(), title: 'share link via email', children: jsxRuntime.jsx("img", { src: ChevronSVG, alt: '\\/', className: 'tw-h-4 tw-w-4' }) })), platforms.includes('clipboard') && (jsxRuntime.jsx("div", { rel: 'noopener noreferrer', className: 'tw-w-8 tw-h-8 tw-mt-2 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-text-white hover:tw-cursor-pointer', style: {
|
|
4516
4849
|
color: 'white',
|
|
4517
4850
|
backgroundColor: '#888',
|
|
4518
|
-
}, onClick: () => copyLink(), title: 'copy Link', children: jsxRuntime.jsx("
|
|
4851
|
+
}, onClick: () => copyLink(), title: 'copy Link', children: jsxRuntime.jsx("img", { src: ClipboardSVG, className: 'tw-w-5' }) }))] }));
|
|
4519
4852
|
};
|
|
4520
4853
|
|
|
4521
4854
|
const GroupSubHeaderView = ({ item, shareBaseUrl, platforms, }) => (jsxRuntime.jsxs("div", { className: 'tw-px-6', children: [jsxRuntime.jsxs("div", { className: 'tw-float-left tw-mt-2 tw-mb-4 tw-flex tw-items-center', children: [item.status && (jsxRuntime.jsx("div", { className: 'tw-mt-1.5', children: jsxRuntime.jsx("span", { className: 'tw-text-sm tw-text-current tw-bg-base-300 tw-rounded tw-py-0.5 tw-px-2 tw-inline-flex tw-items-center tw-mr-2', children: item.status }) })), item.group_type && (jsxRuntime.jsx("div", { className: 'tw-mt-1.5', children: jsxRuntime.jsx("span", { className: 'tw-text-sm tw-text-current tw-bg-base-300 tw-rounded tw-py-1 tw-px-2', children: item.group_type }) }))] }), jsxRuntime.jsx("div", { children: jsxRuntime.jsx(SocialShareBar, { url: shareBaseUrl && item.slug
|
|
@@ -4546,10 +4879,8 @@ const get = (value, path, defaultValue) => {
|
|
|
4546
4879
|
|
|
4547
4880
|
const ProfileTextView = ({ item, dataField = 'text', heading, hideWhenEmpty, }) => {
|
|
4548
4881
|
const text = get(item, dataField);
|
|
4549
|
-
|
|
4550
|
-
|
|
4551
|
-
}
|
|
4552
|
-
return (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-mt-2 tw-px-6', children: [!(text === '' && hideWhenEmpty) && (jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading })), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { itemId: item.id, rawText: text }) })] }));
|
|
4882
|
+
const parsedText = typeof text !== 'string' ? '' : text;
|
|
4883
|
+
return (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-mt-2 tw-px-6', children: [!(text === '' && hideWhenEmpty) && (jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading })), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { itemId: item.id, rawText: parsedText }) })] }));
|
|
4553
4884
|
};
|
|
4554
4885
|
|
|
4555
4886
|
const componentMap$1 = {
|
|
@@ -4579,10 +4910,35 @@ const SimpleView = ({ item }) => {
|
|
|
4579
4910
|
return (jsxRuntime.jsx("div", { className: 'tw-mt-8 tw-h-full tw-overflow-y-auto fade tw-px-6', children: jsxRuntime.jsx(TextView, { text: item.text, itemId: item.id }) }));
|
|
4580
4911
|
};
|
|
4581
4912
|
|
|
4913
|
+
function LinkIcon({
|
|
4914
|
+
title,
|
|
4915
|
+
titleId,
|
|
4916
|
+
...props
|
|
4917
|
+
}, svgRef) {
|
|
4918
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
4919
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4920
|
+
fill: "none",
|
|
4921
|
+
viewBox: "0 0 24 24",
|
|
4922
|
+
strokeWidth: 1.5,
|
|
4923
|
+
stroke: "currentColor",
|
|
4924
|
+
"aria-hidden": "true",
|
|
4925
|
+
"data-slot": "icon",
|
|
4926
|
+
ref: svgRef,
|
|
4927
|
+
"aria-labelledby": titleId
|
|
4928
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
4929
|
+
id: titleId
|
|
4930
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
4931
|
+
strokeLinecap: "round",
|
|
4932
|
+
strokeLinejoin: "round",
|
|
4933
|
+
d: "M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244"
|
|
4934
|
+
}));
|
|
4935
|
+
}
|
|
4936
|
+
const ForwardRef$2 = /*#__PURE__*/ React__namespace.forwardRef(LinkIcon);
|
|
4937
|
+
|
|
4582
4938
|
function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRelations, itemType, collection = 'items', customStyle, }) {
|
|
4583
4939
|
const hasUserPermission = useHasUserPermission();
|
|
4584
|
-
const [modalOpen, setModalOpen] =
|
|
4585
|
-
const [search, setSearch] =
|
|
4940
|
+
const [modalOpen, setModalOpen] = React.useState(false);
|
|
4941
|
+
const [search, setSearch] = React.useState('');
|
|
4586
4942
|
const getItemTags = useGetItemTags();
|
|
4587
4943
|
const items = useItems();
|
|
4588
4944
|
const filterdItems = items
|
|
@@ -4598,12 +4954,12 @@ function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRel
|
|
|
4598
4954
|
}, style: {
|
|
4599
4955
|
backgroundColor,
|
|
4600
4956
|
color: '#fff',
|
|
4601
|
-
}, children: jsxRuntime.jsx(
|
|
4957
|
+
}, children: jsxRuntime.jsx(ForwardRef$2, { className: 'tw-h-5 tw-w-5 tw-stroke-[2.5]' }) })), triggerAddButton && (jsxRuntime.jsx("button", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow tw-mt-2', onClick: () => {
|
|
4602
4958
|
triggerAddButton();
|
|
4603
4959
|
}, style: {
|
|
4604
4960
|
backgroundColor,
|
|
4605
4961
|
color: '#fff',
|
|
4606
|
-
}, children: jsxRuntime.jsx(
|
|
4962
|
+
}, children: jsxRuntime.jsx(ForwardRef$5, { className: 'tw-w-5 tw-h-5 tw-stroke-[2.5]' }) }))] }), jsxRuntime.jsxs(DialogModal, { title: 'Select', isOpened: modalOpen, onClose: () => setModalOpen(false), className: 'tw-w-xl sm:tw-w-2xl tw-min-h-80 tw-bg-base-200', children: [jsxRuntime.jsx(TextInput, { defaultValue: '', placeholder: '\uD83D\uDD0D Search', containerStyle: 'lg:col-span-2 tw-m-4 ', updateFormValue: (val) => {
|
|
4607
4963
|
setSearch(val);
|
|
4608
4964
|
} }), jsxRuntime.jsx("div", { className: 'tw-grid tw-grid-cols-1 sm:tw-grid-cols-2', children: filterdItems
|
|
4609
4965
|
.filter((item) => {
|
|
@@ -4617,33 +4973,58 @@ function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRel
|
|
|
4617
4973
|
}, children: jsxRuntime.jsx(HeaderView, { item: i, hideMenu: true }) }, i.id))) })] })] })) }));
|
|
4618
4974
|
}
|
|
4619
4975
|
|
|
4976
|
+
function LinkSlashIcon({
|
|
4977
|
+
title,
|
|
4978
|
+
titleId,
|
|
4979
|
+
...props
|
|
4980
|
+
}, svgRef) {
|
|
4981
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
4982
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4983
|
+
fill: "none",
|
|
4984
|
+
viewBox: "0 0 24 24",
|
|
4985
|
+
strokeWidth: 1.5,
|
|
4986
|
+
stroke: "currentColor",
|
|
4987
|
+
"aria-hidden": "true",
|
|
4988
|
+
"data-slot": "icon",
|
|
4989
|
+
ref: svgRef,
|
|
4990
|
+
"aria-labelledby": titleId
|
|
4991
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
4992
|
+
id: titleId
|
|
4993
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
4994
|
+
strokeLinecap: "round",
|
|
4995
|
+
strokeLinejoin: "round",
|
|
4996
|
+
d: "M13.181 8.68a4.503 4.503 0 0 1 1.903 6.405m-9.768-2.782L3.56 14.06a4.5 4.5 0 0 0 6.364 6.365l3.129-3.129m5.614-5.615 1.757-1.757a4.5 4.5 0 0 0-6.364-6.365l-4.5 4.5c-.258.26-.479.541-.661.84m1.903 6.405a4.495 4.495 0 0 1-1.242-.88 4.483 4.483 0 0 1-1.062-1.683m6.587 2.345 5.907 5.907m-5.907-5.907L8.898 8.898M2.991 2.99 8.898 8.9"
|
|
4997
|
+
}));
|
|
4998
|
+
}
|
|
4999
|
+
const ForwardRef$1 = /*#__PURE__*/ React__namespace.forwardRef(LinkSlashIcon);
|
|
5000
|
+
|
|
4620
5001
|
function LinkedItemsHeaderView({ item, unlinkCallback, loading, unlinkPermission, }) {
|
|
4621
5002
|
const appState = useAppState();
|
|
4622
5003
|
const avatar = appState.assetsApi.url + item.image;
|
|
4623
5004
|
const title = item.name;
|
|
4624
5005
|
const subtitle = item.subname;
|
|
4625
|
-
|
|
4626
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row', children: [jsxRuntime.jsx("div", { className: 'tw-grow tw-max-w-[calc(100%-60px)] }', children: jsxRuntime.jsxs("div", { className: 'flex items-center', children: [avatar && (jsxRuntime.jsx("img", { className: 'tw-w-10 tw-inline tw-rounded-full', src: avatar, alt: item.name + ' logo' })), jsxRuntime.jsxs("div", { className: `${avatar ? 'tw-ml-2' : ''} tw-overflow-hidden`, children: [jsxRuntime.jsx("div", { className: 'tw-text-xl tw-font-semibold tw-truncate', children: title }), subtitle && (jsxRuntime.jsx("div", { className: 'tw-text-xs tw-truncate tw-text-gray-500 ', children: subtitle }))] })] }) }), jsxRuntime.jsx("div", { className: 'tw-col-span-1', onClick: (e) => e.stopPropagation(), children: unlinkPermission && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: ' tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx(
|
|
5006
|
+
React.useEffect(() => { }, [item]);
|
|
5007
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row', children: [jsxRuntime.jsx("div", { className: 'tw-grow tw-max-w-[calc(100%-60px)] }', children: jsxRuntime.jsxs("div", { className: 'flex items-center', children: [avatar && (jsxRuntime.jsx("img", { className: 'tw-w-10 tw-inline tw-rounded-full', src: avatar, alt: item.name + ' logo' })), jsxRuntime.jsxs("div", { className: `${avatar ? 'tw-ml-2' : ''} tw-overflow-hidden`, children: [jsxRuntime.jsx("div", { className: 'tw-text-xl tw-font-semibold tw-truncate', children: title }), subtitle && (jsxRuntime.jsx("div", { className: 'tw-text-xs tw-truncate tw-text-gray-500 ', children: subtitle }))] })] }) }), jsxRuntime.jsx("div", { className: 'tw-col-span-1', onClick: (e) => e.stopPropagation(), children: unlinkPermission && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: ' tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx(ForwardRef$9, { className: 'tw-h-5 tw-w-5' }) }), jsxRuntime.jsx("ul", { tabIndex: 0, className: 'tw-dropdown-content tw-menu tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-z-1000', children: (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: 'tw-cursor-pointer !tw-text-error', onClick: () => unlinkCallback(item.id), children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-sm' })) : (jsxRuntime.jsx(ForwardRef$1, { className: 'tw-h-5 tw-w-5 tw-stroke-[3]' })) }) })) })] })) })] }) }));
|
|
4627
5008
|
}
|
|
4628
5009
|
|
|
4629
5010
|
const TabsView = ({ attestations, item, offers, needs, relations, updatePermission, loading, linkItem, unlinkItem, }) => {
|
|
4630
5011
|
const addFilterTag = useAddFilterTag();
|
|
4631
|
-
const [activeTab, setActiveTab] =
|
|
5012
|
+
const [activeTab, setActiveTab] = React.useState();
|
|
4632
5013
|
const navigate = reactRouterDom.useNavigate();
|
|
4633
|
-
const [addItemPopupType] =
|
|
5014
|
+
const [addItemPopupType] = React.useState('');
|
|
4634
5015
|
const items = useItems();
|
|
4635
5016
|
const appState = useAppState();
|
|
4636
5017
|
const getUserProfile = (id) => {
|
|
4637
5018
|
return items.find((i) => i.user_created?.id === id && i.layer?.itemType.name === appState.userType);
|
|
4638
5019
|
};
|
|
4639
|
-
|
|
5020
|
+
React.useEffect(() => {
|
|
4640
5021
|
scroll();
|
|
4641
5022
|
}, [addItemPopupType]);
|
|
4642
5023
|
function scroll() {
|
|
4643
5024
|
tabRef.current?.scrollIntoView();
|
|
4644
5025
|
}
|
|
4645
|
-
const tabRef =
|
|
4646
|
-
const updateActiveTab =
|
|
5026
|
+
const tabRef = React.useRef(null);
|
|
5027
|
+
const updateActiveTab = React.useCallback((id) => {
|
|
4647
5028
|
setActiveTab(id);
|
|
4648
5029
|
const params = new URLSearchParams(window.location.search);
|
|
4649
5030
|
params.set('tab', `${id}`);
|
|
@@ -4652,7 +5033,7 @@ const TabsView = ({ attestations, item, offers, needs, relations, updatePermissi
|
|
|
4652
5033
|
},
|
|
4653
5034
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4654
5035
|
[location.pathname]);
|
|
4655
|
-
|
|
5036
|
+
React.useEffect(() => {
|
|
4656
5037
|
const params = new URLSearchParams(location.search);
|
|
4657
5038
|
const urlTab = params.get('tab');
|
|
4658
5039
|
setActiveTab(urlTab ? Number(urlTab) : 1);
|
|
@@ -4672,13 +5053,13 @@ const TabsView = ({ attestations, item, offers, needs, relations, updatePermissi
|
|
|
4672
5053
|
* @category Profile
|
|
4673
5054
|
*/
|
|
4674
5055
|
function ProfileView({ attestationApi }) {
|
|
4675
|
-
const [item, setItem] =
|
|
4676
|
-
const [updatePermission, setUpdatePermission] =
|
|
4677
|
-
const [relations, setRelations] =
|
|
4678
|
-
const [offers, setOffers] =
|
|
4679
|
-
const [needs, setNeeds] =
|
|
4680
|
-
const [loading, setLoading] =
|
|
4681
|
-
const [template, setTemplate] =
|
|
5056
|
+
const [item, setItem] = React.useState();
|
|
5057
|
+
const [updatePermission, setUpdatePermission] = React.useState(false);
|
|
5058
|
+
const [relations, setRelations] = React.useState([]);
|
|
5059
|
+
const [offers, setOffers] = React.useState([]);
|
|
5060
|
+
const [needs, setNeeds] = React.useState([]);
|
|
5061
|
+
const [loading, setLoading] = React.useState(false);
|
|
5062
|
+
const [template, setTemplate] = React.useState('');
|
|
4682
5063
|
const location = reactRouterDom.useLocation();
|
|
4683
5064
|
const items = useItems();
|
|
4684
5065
|
const updateItem = useUpdateItem();
|
|
@@ -4692,8 +5073,8 @@ function ProfileView({ attestationApi }) {
|
|
|
4692
5073
|
const clusterRef = useClusterRef();
|
|
4693
5074
|
const leafletRefs = useLeafletRefs();
|
|
4694
5075
|
const appState = useAppState();
|
|
4695
|
-
const [attestations, setAttestations] =
|
|
4696
|
-
|
|
5076
|
+
const [attestations, setAttestations] = React.useState([]);
|
|
5077
|
+
React.useEffect(() => {
|
|
4697
5078
|
if (attestationApi) {
|
|
4698
5079
|
attestationApi
|
|
4699
5080
|
.getItems()
|
|
@@ -4710,12 +5091,12 @@ function ProfileView({ attestationApi }) {
|
|
|
4710
5091
|
});
|
|
4711
5092
|
}
|
|
4712
5093
|
}, [attestationApi]);
|
|
4713
|
-
|
|
5094
|
+
React.useEffect(() => {
|
|
4714
5095
|
const itemId = location.pathname.split('/')[2];
|
|
4715
5096
|
const item = items.find((i) => i.id === itemId);
|
|
4716
5097
|
item && setItem(item);
|
|
4717
5098
|
}, [items, location]);
|
|
4718
|
-
|
|
5099
|
+
React.useEffect(() => {
|
|
4719
5100
|
setOffers([]);
|
|
4720
5101
|
setNeeds([]);
|
|
4721
5102
|
setRelations([]);
|
|
@@ -4733,7 +5114,7 @@ function ProfileView({ attestationApi }) {
|
|
|
4733
5114
|
});
|
|
4734
5115
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4735
5116
|
}, [item, items]);
|
|
4736
|
-
|
|
5117
|
+
React.useEffect(() => {
|
|
4737
5118
|
const setMap = (marker, x) => {
|
|
4738
5119
|
map.setView(new leaflet.LatLng(item?.position?.coordinates[1], item?.position?.coordinates[0] + x / 4), undefined);
|
|
4739
5120
|
setTimeout(() => {
|
|
@@ -4774,15 +5155,15 @@ function ProfileView({ attestationApi }) {
|
|
|
4774
5155
|
return parent;
|
|
4775
5156
|
}
|
|
4776
5157
|
};
|
|
4777
|
-
|
|
5158
|
+
React.useEffect(() => {
|
|
4778
5159
|
item && hasUserPermission('items', 'update', item) && setUpdatePermission(true);
|
|
4779
5160
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4780
5161
|
}, [item]);
|
|
4781
|
-
|
|
5162
|
+
React.useEffect(() => {
|
|
4782
5163
|
selectPosition && map.closePopup();
|
|
4783
5164
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4784
5165
|
}, [selectPosition]);
|
|
4785
|
-
|
|
5166
|
+
React.useEffect(() => {
|
|
4786
5167
|
setTemplate(item?.layer?.itemType.template ?? appState.userType);
|
|
4787
5168
|
}, [appState.userType, item]);
|
|
4788
5169
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: item && (jsxRuntime.jsx(MapOverlayPage, { className: `!tw-p-0 tw-mx-4 tw-mt-4 tw-mb-4 md:tw-w-[calc(50%-32px)] tw-w-[calc(100%-32px)] tw-min-w-80 tw-max-w-3xl !tw-left-0 sm:!tw-left-auto tw-top-0 tw-bottom-0 tw-transition-opacity tw-duration-500 ${!selectPosition ? 'tw-opacity-100 tw-pointer-events-auto' : 'tw-opacity-0 tw-pointer-events-none'}`, children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'tw-px-6 tw-pt-6', children: jsxRuntime.jsx(HeaderView, { api: item.layer?.api, item: item, deleteCallback: (e) => handleDelete(e, item, setLoading, removeItem, map, navigate), editCallback: () => navigate('/edit-item/' + item.id), setPositionCallback: () => {
|
|
@@ -4792,14 +5173,41 @@ function ProfileView({ attestationApi }) {
|
|
|
4792
5173
|
}, big: true, truncateSubname: false }) }), template === 'onepager' && jsxRuntime.jsx(OnepagerView, { item: item }), template === 'simple' && jsxRuntime.jsx(SimpleView, { item: item }), template === 'flex' && jsxRuntime.jsx(FlexView, { item: item }), template === 'tabs' && (jsxRuntime.jsx(TabsView, { attestations: attestations, item: item, loading: loading, offers: offers, needs: needs, relations: relations, updatePermission: updatePermission, linkItem: (id) => linkItem(id, item, updateItem), unlinkItem: (id) => unlinkItem(id, item, updateItem) }))] }) }, item.id)) }));
|
|
4793
5174
|
}
|
|
4794
5175
|
|
|
5176
|
+
function ArrowUpTrayIcon({
|
|
5177
|
+
title,
|
|
5178
|
+
titleId,
|
|
5179
|
+
...props
|
|
5180
|
+
}, svgRef) {
|
|
5181
|
+
return /*#__PURE__*/React__namespace.createElement("svg", Object.assign({
|
|
5182
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
5183
|
+
fill: "none",
|
|
5184
|
+
viewBox: "0 0 24 24",
|
|
5185
|
+
strokeWidth: 1.5,
|
|
5186
|
+
stroke: "currentColor",
|
|
5187
|
+
"aria-hidden": "true",
|
|
5188
|
+
"data-slot": "icon",
|
|
5189
|
+
ref: svgRef,
|
|
5190
|
+
"aria-labelledby": titleId
|
|
5191
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
5192
|
+
id: titleId
|
|
5193
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
5194
|
+
strokeLinecap: "round",
|
|
5195
|
+
strokeLinejoin: "round",
|
|
5196
|
+
d: "M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5"
|
|
5197
|
+
}));
|
|
5198
|
+
}
|
|
5199
|
+
const ForwardRef = /*#__PURE__*/ React__namespace.forwardRef(ArrowUpTrayIcon);
|
|
5200
|
+
|
|
5201
|
+
var UserSVG = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMCIgdmlld0JveD0iMCAwIDE1MCAxNTAiIGNsYXNzPSJ0dy13LTIwIHR3LWgtMjAgdHctcm91bmRlZC1mdWxsIiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjogcmdiKDIzOCwgMjM4LCAyMzgpOyI+PHBhdGggZmlsbD0iI2NjYyIgZD0iTSAxMDQuNjg3MzEsNTYuNjg5MzUzIEMgMTAyLjE5NDM1LDgwLjY0MDQ5MyA5My4xMDQ5ODEsOTcuMjY4NzUgNzQuMzcyMTk2LDk3LjI2ODc1IDU1LjYzOTQwMiw5Ny4yNjg3NSA0Ni45ODg4MjMsODIuMzA4MDM0IDQ0LjA1NzAwNSw1Ny4yODk5NDEgNDEuNjIzMzE0LDM0LjkzODgzOCA1NS42Mzk0MDIsMTUuODAwMTUyIDc0LjM3MjE5NiwxNS44MDAxNTIgYyAxOC43MzI3ODUsMCAzMi40NTE5NDQsMTguNDkzOTcxIDMwLjMxNTExNCw0MC44ODkyMDEgeiI+PC9wYXRoPjxwYXRoIGZpbGw9IiNjY2MiIGQ9Ik0gOTIuNTY3NSA4OS42MDQ4IEMgOTAuNzk0ODQgOTMuNDc4OTMgODkuMzk4OTMgMTAyLjQ1MDQgOTQuODY0NzggMTA2LjkwMzkgQyAxMDMuOTM3NSAxMTQuMjk2MyAxMDYuNzA2NCAxMTYuNDcyMyAxMTguMzExNyAxMTguOTQ2MiBDIDE0NC4wNDMyIDEyNC40MzE0IDE0MS42NDkyIDEzOC4xNTQzIDE0Ni41MjQ0IDE0OS4yMjA2IEwgNC4yNjg0NDQgMTQ5LjEwMjMgQyA4LjQ3MjIyMyAxMzguNjUxOCA2LjUwNTc5OSAxMjQuNzgxMiAzMi40MDA1MSAxMTguMzg3IEMgNDEuODA5OTIgMTE2LjA2MzUgNDUuNjY1MTMgMTEzLjg4MjMgNTMuNTg2NTkgMTA3LjAxNTggQyA1OC41Mjc0NCAxMDIuNzMyOSA1Ny41MjU4MyA5My45OTI2NyA1Ni40MzA4NCA4OS4yNjkyNiBDIDUyLjQ5Mjc1IDg4LjgzMDExIDk0LjE3MzkgODguMTQwNTQgOTIuNTY3NSA4OS42MDQ4IHoiPjwvcGF0aD48L3N2Zz4=';
|
|
5202
|
+
|
|
4795
5203
|
const AvatarWidget = ({ avatar, setAvatar }) => {
|
|
4796
|
-
const [crop, setCrop] =
|
|
4797
|
-
const [image, setImage] =
|
|
4798
|
-
const [cropModalOpen, setCropModalOpen] =
|
|
4799
|
-
const [cropping, setCropping] =
|
|
5204
|
+
const [crop, setCrop] = React.useState();
|
|
5205
|
+
const [image, setImage] = React.useState('');
|
|
5206
|
+
const [cropModalOpen, setCropModalOpen] = React.useState(false);
|
|
5207
|
+
const [cropping, setCropping] = React.useState(false);
|
|
4800
5208
|
const appState = useAppState();
|
|
4801
|
-
const imgRef =
|
|
4802
|
-
const onImageChange =
|
|
5209
|
+
const imgRef = React.useRef(null);
|
|
5210
|
+
const onImageChange = React.useCallback((event) => {
|
|
4803
5211
|
const file = event.target.files && event.target.files[0];
|
|
4804
5212
|
if (file) {
|
|
4805
5213
|
const validFormats = ['image/jpeg', 'image/png'];
|
|
@@ -4820,7 +5228,7 @@ const AvatarWidget = ({ avatar, setAvatar }) => {
|
|
|
4820
5228
|
alert('No file selected or an error occurred while selecting the file.');
|
|
4821
5229
|
}
|
|
4822
5230
|
}, []);
|
|
4823
|
-
const onImageLoad =
|
|
5231
|
+
const onImageLoad = React.useCallback((e) => {
|
|
4824
5232
|
const { width, height } = e.currentTarget;
|
|
4825
5233
|
setCrop(centerAspectCrop(width, height, 1));
|
|
4826
5234
|
}, []);
|
|
@@ -4853,7 +5261,7 @@ const AvatarWidget = ({ avatar, setAvatar }) => {
|
|
|
4853
5261
|
await resizedImage.decode();
|
|
4854
5262
|
return resizedImage;
|
|
4855
5263
|
}
|
|
4856
|
-
const renderCrop =
|
|
5264
|
+
const renderCrop = React.useCallback(async () => {
|
|
4857
5265
|
const image = imgRef.current;
|
|
4858
5266
|
if (crop && image) {
|
|
4859
5267
|
const resizedImage = await resizeImage(image, 1024, 1024); // Bildgröße vor dem Zuschneiden reduzieren
|
|
@@ -4875,7 +5283,7 @@ const AvatarWidget = ({ avatar, setAvatar }) => {
|
|
|
4875
5283
|
}
|
|
4876
5284
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4877
5285
|
}, [crop]);
|
|
4878
|
-
const resizeBlob =
|
|
5286
|
+
const resizeBlob = React.useCallback(async (blob) => {
|
|
4879
5287
|
const img = new Image();
|
|
4880
5288
|
img.src = URL.createObjectURL(blob);
|
|
4881
5289
|
await img.decode();
|
|
@@ -4886,7 +5294,7 @@ const AvatarWidget = ({ avatar, setAvatar }) => {
|
|
|
4886
5294
|
const asset = await appState.assetsApi.upload(resizedBlob, 'avatar');
|
|
4887
5295
|
setAvatar(asset.id);
|
|
4888
5296
|
}, [appState.assetsApi, setAvatar]);
|
|
4889
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!cropping ? (jsxRuntime.jsxs("label", { className: 'custom-file-upload', children: [jsxRuntime.jsx("input", { type: 'file', accept: 'image/*', className: 'tw-file-input tw-w-full tw-max-w-xs', onChange: onImageChange }), jsxRuntime.jsx("div", { className: 'button tw-btn tw-btn-lg tw-btn-circle tw-animate-none', children: jsxRuntime.jsx(
|
|
5297
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!cropping ? (jsxRuntime.jsxs("label", { className: 'custom-file-upload', children: [jsxRuntime.jsx("input", { type: 'file', accept: 'image/*', className: 'tw-file-input tw-w-full tw-max-w-xs', onChange: onImageChange }), jsxRuntime.jsx("div", { className: 'button tw-btn tw-btn-lg tw-btn-circle tw-animate-none', children: jsxRuntime.jsx(ForwardRef, { className: 'tw-w-6 tw-h-6' }) }), avatar ? (jsxRuntime.jsx("div", { className: 'tw-h-20 tw-w-20', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url + avatar, className: 'tw-h-20 tw-w-20 tw-rounded-full' }) })) : (jsxRuntime.jsx("div", { className: 'tw-h-20 tw-w-20', children: jsxRuntime.jsx("img", { src: UserSVG, className: 'tw-rounded-full' }) }))] })) : (jsxRuntime.jsx("div", { className: 'tw-w-20 tw-flex tw-items-center tw-justify-center', children: jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) })), jsxRuntime.jsxs(DialogModal, { title: '', isOpened: cropModalOpen, onClose: () => {
|
|
4890
5298
|
setCropModalOpen(false);
|
|
4891
5299
|
setImage('');
|
|
4892
5300
|
}, closeOnClickOutside: false, children: [jsxRuntime.jsx(reactImageCrop.ReactCrop, { crop: crop, onChange: (c) => setCrop(c), aspect: 1, children: jsxRuntime.jsx("img", { src: image, ref: imgRef, onLoad: onImageLoad }) }), jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-primary', onClick: () => {
|
|
@@ -4905,7 +5313,7 @@ styleInject(css_248z);
|
|
|
4905
5313
|
/* eslint-disable @typescript-eslint/no-unsafe-call */
|
|
4906
5314
|
// Improved version of https://usehooks.com/useOnClickOutside/
|
|
4907
5315
|
const useClickOutside = (ref, handler) => {
|
|
4908
|
-
|
|
5316
|
+
React.useEffect(() => {
|
|
4909
5317
|
let startedInside = false;
|
|
4910
5318
|
let startedWhenMounted = false;
|
|
4911
5319
|
const listener = (event) => {
|
|
@@ -4934,12 +5342,12 @@ const useClickOutside = (ref, handler) => {
|
|
|
4934
5342
|
|
|
4935
5343
|
// eslint-disable-next-line react/prop-types
|
|
4936
5344
|
const ColorPicker = ({ color, onChange, className }) => {
|
|
4937
|
-
const popover =
|
|
4938
|
-
const [isOpen, toggle] =
|
|
4939
|
-
const close =
|
|
5345
|
+
const popover = React.useRef(null);
|
|
5346
|
+
const [isOpen, toggle] = React.useState(false);
|
|
5347
|
+
const close = React.useCallback(() => toggle(false), []);
|
|
4940
5348
|
useClickOutside(popover, close);
|
|
4941
|
-
const colorPickerRef =
|
|
4942
|
-
|
|
5349
|
+
const colorPickerRef = React.useRef(null);
|
|
5350
|
+
React.useEffect(() => {
|
|
4943
5351
|
// Füge dem Color-Picker explizit Event-Listener hinzu
|
|
4944
5352
|
const colorPickerElement = colorPickerRef.current;
|
|
4945
5353
|
if (colorPickerElement) {
|
|
@@ -4990,7 +5398,7 @@ const ComboBoxInput = ({ id, options, value, onValueChange }) => {
|
|
|
4990
5398
|
};
|
|
4991
5399
|
|
|
4992
5400
|
const GroupSubheaderForm = ({ state, setState, groupStates, groupTypes, }) => {
|
|
4993
|
-
|
|
5401
|
+
React.useEffect(() => {
|
|
4994
5402
|
if (groupTypes && groupStates) {
|
|
4995
5403
|
const groupType = groupTypes.find((gt) => gt.groupTypes_id.name === state.group_type);
|
|
4996
5404
|
const customImage = !groupTypes.some((gt) => gt.groupTypes_id.image === state.image || !state.image);
|
|
@@ -5026,16 +5434,18 @@ const ProfileStartEndForm = ({ item, setState, }) => {
|
|
|
5026
5434
|
})) }));
|
|
5027
5435
|
};
|
|
5028
5436
|
|
|
5437
|
+
var MarkdownSVG = 'data:image/svg+xml;base64,PHN2ZyAgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJwogICAgICBhcmlhLWhpZGRlbj0ndHJ1ZScKICAgICAgaGVpZ2h0PScxNicKICAgICAgdmlld0JveD0nMCAwIDE2IDE2JwogICAgICB2ZXJzaW9uPScxLjEnCiAgICAgIHdpZHRoPScxNicKICAgICAgZGF0YS12aWV3LWNvbXBvbmVudD0ndHJ1ZScKICAgICAgY2xhc3NOYW1lPSdvY3RpY29uIG9jdGljb24tbWFya2Rvd24nCiAgICAgIGZpbGw9J3JnYigxNTYgMTYzIDE3NSknCj4KICA8cGF0aCBkPSdNMTQuODUgM2MuNjMgMCAxLjE1LjUyIDEuMTQgMS4xNXY3LjdjMCAuNjMtLjUxIDEuMTUtMS4xNSAxLjE1SDEuMTVDLjUyIDEzIDAgMTIuNDggMCAxMS44NFY0LjE1QzAgMy41Mi41MiAzIDEuMTUgM1pNOSAxMVY1SDdMNS41IDcgNCA1SDJ2NmgyVjhsMS41IDEuOTJMNyA4djNabTIuOTkuNUwxNC41IDhIMTNWNWgtMnYzSDkuNVonPjwvcGF0aD4KPC9zdmc+';
|
|
5438
|
+
|
|
5029
5439
|
const MarkdownHint = () => {
|
|
5030
|
-
const [expended, setExpended] =
|
|
5031
|
-
return (jsxRuntime.jsxs("div", { onClick: () => setExpended(true), title: 'Markdown is supported', className: 'flex tw-flex-row tw-text-gray-400 tw-cursor-pointer tw-items-center', children: [jsxRuntime.jsx("
|
|
5440
|
+
const [expended, setExpended] = React.useState(false);
|
|
5441
|
+
return (jsxRuntime.jsxs("div", { onClick: () => setExpended(true), title: 'Markdown is supported', className: 'flex tw-flex-row tw-text-gray-400 tw-cursor-pointer tw-items-center', children: [jsxRuntime.jsx("img", { src: MarkdownSVG, alt: 'Markdown', className: 'octicon octicon-markdown tw-gray-400' }), expended && (jsxRuntime.jsxs("a", { href: 'https://www.markdownguide.org/cheat-sheet/#basic-syntax', target: '_blank', rel: 'noreferrer', children: [jsxRuntime.jsx("span", { className: 'Button-label tw-ml-1', children: "Markdown is support" }), ' '] }))] }));
|
|
5032
5442
|
};
|
|
5033
5443
|
|
|
5034
5444
|
const ProfileTextForm = ({ state, setState,
|
|
5035
5445
|
// Is this really used?
|
|
5036
5446
|
dataField, heading, size, hideInputLabel, required, }) => {
|
|
5037
|
-
const [field, setField] =
|
|
5038
|
-
|
|
5447
|
+
const [field, setField] = React.useState(dataField || 'text');
|
|
5448
|
+
React.useEffect(() => {
|
|
5039
5449
|
if (!dataField) {
|
|
5040
5450
|
setField('text');
|
|
5041
5451
|
}
|
|
@@ -5080,15 +5490,15 @@ const SimpleForm = ({ state, setState }) => {
|
|
|
5080
5490
|
};
|
|
5081
5491
|
|
|
5082
5492
|
const Autocomplete = ({ inputProps, suggestions, onSelected, pushFilteredSuggestions, setFocus, }) => {
|
|
5083
|
-
const [filteredSuggestions, setFilteredSuggestions] =
|
|
5084
|
-
const [heighlightedSuggestion, setHeighlightedSuggestion] =
|
|
5085
|
-
|
|
5493
|
+
const [filteredSuggestions, setFilteredSuggestions] = React.useState([]);
|
|
5494
|
+
const [heighlightedSuggestion, setHeighlightedSuggestion] = React.useState(0);
|
|
5495
|
+
React.useEffect(() => {
|
|
5086
5496
|
pushFilteredSuggestions && setFilteredSuggestions(pushFilteredSuggestions);
|
|
5087
5497
|
}, [pushFilteredSuggestions]);
|
|
5088
|
-
|
|
5498
|
+
React.useEffect(() => {
|
|
5089
5499
|
setFocus && inputRef.current?.focus();
|
|
5090
5500
|
}, [setFocus]);
|
|
5091
|
-
const inputRef =
|
|
5501
|
+
const inputRef = React.useRef();
|
|
5092
5502
|
const getSuggestions = (value) => {
|
|
5093
5503
|
const inputValue = value.trim().toLowerCase();
|
|
5094
5504
|
const inputLength = inputValue.length;
|
|
@@ -5133,13 +5543,13 @@ const Autocomplete = ({ inputProps, suggestions, onSelected, pushFilteredSuggest
|
|
|
5133
5543
|
|
|
5134
5544
|
// eslint-disable-next-line react/prop-types
|
|
5135
5545
|
const TagsWidget = ({ placeholder, containerStyle, defaultTags, onUpdate }) => {
|
|
5136
|
-
const [input, setInput] =
|
|
5137
|
-
const [isKeyReleased, setIsKeyReleased] =
|
|
5546
|
+
const [input, setInput] = React.useState('');
|
|
5547
|
+
const [isKeyReleased, setIsKeyReleased] = React.useState(false);
|
|
5138
5548
|
const tags = useTags();
|
|
5139
|
-
const [pushFilteredSuggestions, setPushFilteredSuggestions] =
|
|
5140
|
-
const [focusInput, setFocusInput] =
|
|
5141
|
-
const [currentTags, setCurrentTags] =
|
|
5142
|
-
|
|
5549
|
+
const [pushFilteredSuggestions, setPushFilteredSuggestions] = React.useState([]);
|
|
5550
|
+
const [focusInput, setFocusInput] = React.useState(false);
|
|
5551
|
+
const [currentTags, setCurrentTags] = React.useState(defaultTags);
|
|
5552
|
+
React.useEffect(() => {
|
|
5143
5553
|
setCurrentTags(defaultTags);
|
|
5144
5554
|
}, [defaultTags]);
|
|
5145
5555
|
const onChange = (e) => {
|
|
@@ -5213,10 +5623,10 @@ const TagsWidget = ({ placeholder, containerStyle, defaultTags, onUpdate }) => {
|
|
|
5213
5623
|
};
|
|
5214
5624
|
|
|
5215
5625
|
const TabsForm = ({ item, state, setState, updatePermission, linkItem, unlinkItem, loading, setUrlParams, }) => {
|
|
5216
|
-
const [activeTab, setActiveTab] =
|
|
5626
|
+
const [activeTab, setActiveTab] = React.useState(1);
|
|
5217
5627
|
const navigate = reactRouterDom.useNavigate();
|
|
5218
5628
|
const updateItem = useUpdateItem();
|
|
5219
|
-
const updateActiveTab =
|
|
5629
|
+
const updateActiveTab = React.useCallback((id) => {
|
|
5220
5630
|
setActiveTab(id);
|
|
5221
5631
|
const params = new URLSearchParams(window.location.search);
|
|
5222
5632
|
params.set('tab', `${id}`);
|
|
@@ -5226,7 +5636,7 @@ const TabsForm = ({ item, state, setState, updatePermission, linkItem, unlinkIte
|
|
|
5226
5636
|
},
|
|
5227
5637
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
5228
5638
|
[location.pathname]);
|
|
5229
|
-
|
|
5639
|
+
React.useEffect(() => {
|
|
5230
5640
|
const params = new URLSearchParams(location.search);
|
|
5231
5641
|
const urlTab = params.get('tab');
|
|
5232
5642
|
setActiveTab(urlTab ? Number(urlTab) : 1);
|
|
@@ -5258,7 +5668,7 @@ const TabsForm = ({ item, state, setState, updatePermission, linkItem, unlinkIte
|
|
|
5258
5668
|
* @category Profile
|
|
5259
5669
|
*/
|
|
5260
5670
|
function ProfileForm() {
|
|
5261
|
-
const [state, setState] =
|
|
5671
|
+
const [state, setState] = React.useState({
|
|
5262
5672
|
color: '',
|
|
5263
5673
|
id: '',
|
|
5264
5674
|
group_type: 'wuerdekompass',
|
|
@@ -5277,9 +5687,9 @@ function ProfileForm() {
|
|
|
5277
5687
|
start: '',
|
|
5278
5688
|
end: '',
|
|
5279
5689
|
});
|
|
5280
|
-
const [updatePermission, setUpdatePermission] =
|
|
5281
|
-
const [loading, setLoading] =
|
|
5282
|
-
const [item, setItem] =
|
|
5690
|
+
const [updatePermission, setUpdatePermission] = React.useState(false);
|
|
5691
|
+
const [loading, setLoading] = React.useState(false);
|
|
5692
|
+
const [item, setItem] = React.useState({});
|
|
5283
5693
|
const { user } = useAuth();
|
|
5284
5694
|
const updateItem = useUpdateItem();
|
|
5285
5695
|
const addItem = useAddItem();
|
|
@@ -5292,27 +5702,33 @@ function ProfileForm() {
|
|
|
5292
5702
|
const getItemTags = useGetItemTags();
|
|
5293
5703
|
const items = useItems();
|
|
5294
5704
|
const appState = useAppState();
|
|
5295
|
-
const [urlParams, setUrlParams] =
|
|
5296
|
-
|
|
5705
|
+
const [urlParams, setUrlParams] = React.useState(new URLSearchParams(location.search));
|
|
5706
|
+
React.useEffect(() => {
|
|
5297
5707
|
item && hasUserPermission('items', 'update', item) && setUpdatePermission(true);
|
|
5298
5708
|
}, [hasUserPermission, item]);
|
|
5299
|
-
|
|
5709
|
+
React.useEffect(() => {
|
|
5300
5710
|
const itemId = location.pathname.split('/')[2];
|
|
5301
5711
|
const item = items.find((i) => i.id === itemId);
|
|
5302
5712
|
item && setItem(item);
|
|
5303
5713
|
if (!item) {
|
|
5304
|
-
|
|
5305
|
-
|
|
5306
|
-
|
|
5307
|
-
|
|
5308
|
-
|
|
5309
|
-
layer
|
|
5310
|
-
|
|
5311
|
-
|
|
5714
|
+
if (items.some((i) => i.user_created?.id === user?.id && i.layer?.userProfileLayer)) {
|
|
5715
|
+
navigate('/');
|
|
5716
|
+
reactToastify.toast.error('Item does not exist');
|
|
5717
|
+
}
|
|
5718
|
+
else {
|
|
5719
|
+
const layer = layers.find((l) => l.userProfileLayer);
|
|
5720
|
+
setItem({
|
|
5721
|
+
id: crypto.randomUUID(),
|
|
5722
|
+
name: user?.first_name ?? '',
|
|
5723
|
+
text: '',
|
|
5724
|
+
layer,
|
|
5725
|
+
new: true,
|
|
5726
|
+
});
|
|
5727
|
+
}
|
|
5312
5728
|
}
|
|
5313
5729
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
5314
5730
|
}, [items]);
|
|
5315
|
-
|
|
5731
|
+
React.useEffect(() => {
|
|
5316
5732
|
const newColor = item.color ??
|
|
5317
5733
|
(getItemTags(item) && getItemTags(item)[0]?.color
|
|
5318
5734
|
? getItemTags(item)[0].color
|
|
@@ -5357,8 +5773,8 @@ function ProfileForm() {
|
|
|
5357
5773
|
});
|
|
5358
5774
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
5359
5775
|
}, [item, tags, items]);
|
|
5360
|
-
const [template, setTemplate] =
|
|
5361
|
-
|
|
5776
|
+
const [template, setTemplate] = React.useState('');
|
|
5777
|
+
React.useEffect(() => {
|
|
5362
5778
|
setTemplate(item.layer?.itemType.template ?? appState.userType);
|
|
5363
5779
|
}, [appState.userType, item]);
|
|
5364
5780
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(MapOverlayPage, { backdrop: true, className: 'tw-mx-4 tw-mt-4 tw-mb-4 tw-overflow-x-hidden tw-w-[calc(100%-32px)] md:tw-w-[calc(50%-32px)] tw-max-w-3xl !tw-left-auto tw-top-0 tw-bottom-0', children: jsxRuntime.jsx("form", { className: 'tw-h-full', onSubmit: (e) => {
|
|
@@ -5375,7 +5791,7 @@ function ProfileForm() {
|
|
|
5375
5791
|
* @category Gaming
|
|
5376
5792
|
*/
|
|
5377
5793
|
function Modal({ children, showOnStartup, }) {
|
|
5378
|
-
|
|
5794
|
+
React.useEffect(() => {
|
|
5379
5795
|
if (showOnStartup) {
|
|
5380
5796
|
window.my_modal_3.showModal();
|
|
5381
5797
|
}
|
|
@@ -5391,18 +5807,18 @@ function Quests() {
|
|
|
5391
5807
|
const questsOpen = useQuestsOpen();
|
|
5392
5808
|
const setQuestsOpen = useSetQuestOpen();
|
|
5393
5809
|
const { isAuthenticated, user } = useAuth();
|
|
5394
|
-
|
|
5810
|
+
React.useEffect(() => {
|
|
5395
5811
|
setQuestsOpen(false);
|
|
5396
5812
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
5397
5813
|
}, []);
|
|
5398
|
-
const [profile, setProfie] =
|
|
5814
|
+
const [profile, setProfie] = React.useState();
|
|
5399
5815
|
const items = useItems();
|
|
5400
|
-
|
|
5816
|
+
React.useEffect(() => {
|
|
5401
5817
|
setProfie(items.find((i) => i.user_created?.id === user?.id &&
|
|
5402
|
-
i.layer?.
|
|
5818
|
+
i.layer?.userProfileLayer &&
|
|
5403
5819
|
i.user_created?.id != null));
|
|
5404
5820
|
}, [items, user]);
|
|
5405
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: questsOpen ? (jsxRuntime.jsx("div", { className: 'tw-card tw-w-48 tw-bg-base-100 tw-shadow-xl tw-absolute tw-bottom-4 tw-left-4 tw-z-[2000]', children: jsxRuntime.jsxs("div", { className: 'tw-card-body tw-p-4 tw-pt-0', children: [jsxRuntime.jsx("div", { className: 'tw-card-actions tw-justify-end', children: jsxRuntime.jsx("label", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-1 tw-top-1', onClick: () => setQuestsOpen(false), children: "\u2715" }) }), jsxRuntime.jsxs("h2", { className: 'tw-card-title tw-m-auto ', children: ["Level 1", jsxRuntime.jsx(
|
|
5821
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: questsOpen ? (jsxRuntime.jsx("div", { className: 'tw-card tw-w-48 tw-bg-base-100 tw-shadow-xl tw-absolute tw-bottom-4 tw-left-4 tw-z-[2000]', children: jsxRuntime.jsxs("div", { className: 'tw-card-body tw-p-4 tw-pt-0', children: [jsxRuntime.jsx("div", { className: 'tw-card-actions tw-justify-end', children: jsxRuntime.jsx("label", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-1 tw-top-1', onClick: () => setQuestsOpen(false), children: "\u2715" }) }), jsxRuntime.jsxs("h2", { className: 'tw-card-title tw-m-auto ', children: ["Level 1", jsxRuntime.jsx(QuestionMarkIcon, {})] }), jsxRuntime.jsxs("ul", { className: 'tw-flex-row', children: [jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("label", { className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-0', children: [jsxRuntime.jsx("input", { type: 'checkbox', readOnly: true, className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: isAuthenticated || false }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2', children: "Sign Up" })] }) }), jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("label", { className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-0', children: [jsxRuntime.jsx("input", { type: 'checkbox', readOnly: true, className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: !!profile?.text }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2', children: "Fill Profile" })] }) }), jsxRuntime.jsx("li", { children: jsxRuntime.jsxs("label", { className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-0', children: [jsxRuntime.jsx("input", { type: 'checkbox', readOnly: true, className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: !!profile?.image }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2', children: "Upload Avatar" })] }) })] }), ' '] }) })) : ('') }));
|
|
5406
5822
|
}
|
|
5407
5823
|
|
|
5408
5824
|
exports.AppShell = AppShell;
|
|
@@ -5420,7 +5836,6 @@ exports.Modal = Modal;
|
|
|
5420
5836
|
exports.MoonCalendar = MoonCalendar;
|
|
5421
5837
|
exports.OverlayItemsIndexPage = OverlayItemsIndexPage;
|
|
5422
5838
|
exports.Permissions = Permissions;
|
|
5423
|
-
exports.PlusButton = PlusButton;
|
|
5424
5839
|
exports.PopupButton = PopupButton;
|
|
5425
5840
|
exports.PopupCheckboxInput = PopupCheckboxInput;
|
|
5426
5841
|
exports.PopupStartEndInput = PopupStartEndInput;
|
|
@@ -5444,5 +5859,4 @@ exports.TextView = TextView;
|
|
|
5444
5859
|
exports.TitleCard = TitleCard;
|
|
5445
5860
|
exports.UserSettings = UserSettings;
|
|
5446
5861
|
exports.UtopiaMap = UtopiaMap;
|
|
5447
|
-
exports.useAuth = useAuth;
|
|
5448
5862
|
//# sourceMappingURL=index.cjs.map
|