@mieweb/forms-editor 1.0.1 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +16 -117
- package/dist/index.js +585 -569
- package/dist/index.js.map +1 -1
- package/package.json +2 -3
package/dist/index.js
CHANGED
|
@@ -5,15 +5,16 @@
|
|
|
5
5
|
if (!document.querySelector('#questionnaire-editor-styles')) {
|
|
6
6
|
const style = document.createElement('style');
|
|
7
7
|
style.id = 'questionnaire-editor-styles';
|
|
8
|
-
style.textContent = "/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');\n@layer properties;\n.pointer-events-none {\n pointer-events: none;\n}\n.visible {\n visibility: visible;\n}\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border-width: 0;\n}\n.absolute {\n position: absolute;\n}\n.fixed {\n position: fixed;\n}\n.relative {\n position: relative;\n}\n.static {\n position: static;\n}\n.sticky {\n position: sticky;\n}\n.inset-0 {\n inset: calc(var(--spacing) * 0);\n}\n.top-0 {\n top: calc(var(--spacing) * 0);\n}\n.top-1\\/2 {\n top: calc(1/2 * 100%);\n}\n.top-2 {\n top: calc(var(--spacing) * 2);\n}\n.top-3 {\n top: calc(var(--spacing) * 3);\n}\n.top-5 {\n top: calc(var(--spacing) * 5);\n}\n.top-11 {\n top: calc(var(--spacing) * 11);\n}\n.top-full {\n top: 100%;\n}\n.right-0 {\n right: calc(var(--spacing) * 0);\n}\n.right-2 {\n right: calc(var(--spacing) * 2);\n}\n.right-3 {\n right: calc(var(--spacing) * 3);\n}\n.right-5 {\n right: calc(var(--spacing) * 5);\n}\n.bottom-0 {\n bottom: calc(var(--spacing) * 0);\n}\n.bottom-5 {\n bottom: calc(var(--spacing) * 5);\n}\n.bottom-full {\n bottom: 100%;\n}\n.-left-2 {\n left: calc(var(--spacing) * -2);\n}\n.left-0 {\n left: calc(var(--spacing) * 0);\n}\n.left-5 {\n left: calc(var(--spacing) * 5);\n}\n.z-10 {\n z-index: 10;\n}\n.z-20 {\n z-index: 20;\n}\n.z-40 {\n z-index: 40;\n}\n.z-50 {\n z-index: 50;\n}\n.z-\\[60\\] {\n z-index: 60;\n}\n.container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n}\n.m-0 {\n margin: calc(var(--spacing) * 0);\n}\n.-mx-6 {\n margin-inline: calc(var(--spacing) * -6);\n}\n.mx-auto {\n margin-inline: auto;\n}\n.my-2 {\n margin-block: calc(var(--spacing) * 2);\n}\n.my-9 {\n margin-block: calc(var(--spacing) * 9);\n}\n.-mt-6 {\n margin-top: calc(var(--spacing) * -6);\n}\n.mt-1 {\n margin-top: calc(var(--spacing) * 1);\n}\n.mt-2 {\n margin-top: calc(var(--spacing) * 2);\n}\n.mt-3 {\n margin-top: calc(var(--spacing) * 3);\n}\n.mt-4 {\n margin-top: calc(var(--spacing) * 4);\n}\n.mt-5 {\n margin-top: calc(var(--spacing) * 5);\n}\n.mt-8 {\n margin-top: calc(var(--spacing) * 8);\n}\n.mt-12 {\n margin-top: calc(var(--spacing) * 12);\n}\n.mr-2 {\n margin-right: calc(var(--spacing) * 2);\n}\n.mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n}\n.mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n}\n.mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n}\n.mb-2\\.5 {\n margin-bottom: calc(var(--spacing) * 2.5);\n}\n.mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n}\n.mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n}\n.mb-5 {\n margin-bottom: calc(var(--spacing) * 5);\n}\n.mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n}\n.mb-10 {\n margin-bottom: calc(var(--spacing) * 10);\n}\n.mb-12 {\n margin-bottom: calc(var(--spacing) * 12);\n}\n.mb-14 {\n margin-bottom: calc(var(--spacing) * 14);\n}\n.ml-2 {\n margin-left: calc(var(--spacing) * 2);\n}\n.ml-auto {\n margin-left: auto;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.grid {\n display: grid;\n}\n.hidden {\n display: none;\n}\n.inline {\n display: inline;\n}\n.inline-flex {\n display: inline-flex;\n}\n.h-1 {\n height: calc(var(--spacing) * 1);\n}\n.h-3 {\n height: calc(var(--spacing) * 3);\n}\n.h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n}\n.h-4 {\n height: calc(var(--spacing) * 4);\n}\n.h-5 {\n height: calc(var(--spacing) * 5);\n}\n.h-6 {\n height: calc(var(--spacing) * 6);\n}\n.h-7 {\n height: calc(var(--spacing) * 7);\n}\n.h-8 {\n height: calc(var(--spacing) * 8);\n}\n.h-9 {\n height: calc(var(--spacing) * 9);\n}\n.h-10 {\n height: calc(var(--spacing) * 10);\n}\n.h-11 {\n height: calc(var(--spacing) * 11);\n}\n.h-12 {\n height: calc(var(--spacing) * 12);\n}\n.h-24 {\n height: calc(var(--spacing) * 24);\n}\n.h-72 {\n height: calc(var(--spacing) * 72);\n}\n.h-auto {\n height: auto;\n}\n.h-dvh {\n height: 100dvh;\n}\n.h-fit {\n height: fit-content;\n}\n.h-full {\n height: 100%;\n}\n.h-screen {\n height: 100vh;\n}\n.max-h-48 {\n max-height: calc(var(--spacing) * 48);\n}\n.max-h-56 {\n max-height: calc(var(--spacing) * 56);\n}\n.max-h-60 {\n max-height: calc(var(--spacing) * 60);\n}\n.max-h-96 {\n max-height: calc(var(--spacing) * 96);\n}\n.max-h-\\[60vh\\] {\n max-height: 60vh;\n}\n.max-h-\\[70vh\\] {\n max-height: 70vh;\n}\n.max-h-\\[80vh\\] {\n max-height: 80vh;\n}\n.max-h-\\[300px\\] {\n max-height: 300px;\n}\n.max-h-\\[calc\\(100svh-13rem\\)\\] {\n max-height: calc(100svh - 13rem);\n}\n.max-h-\\[calc\\(100svh-24rem\\)\\] {\n max-height: calc(100svh - 24rem);\n}\n.max-h-screen {\n max-height: 100vh;\n}\n.min-h-10 {\n min-height: calc(var(--spacing) * 10);\n}\n.min-h-24 {\n min-height: calc(var(--spacing) * 24);\n}\n.min-h-64 {\n min-height: calc(var(--spacing) * 64);\n}\n.min-h-\\[calc\\(100vh-10rem\\)\\] {\n min-height: calc(100vh - 10rem);\n}\n.min-h-dvh {\n min-height: 100dvh;\n}\n.min-h-screen {\n min-height: 100vh;\n}\n.w-1\\/2 {\n width: calc(1/2 * 100%);\n}\n.w-3 {\n width: calc(var(--spacing) * 3);\n}\n.w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n}\n.w-3\\/4 {\n width: calc(3/4 * 100%);\n}\n.w-4 {\n width: calc(var(--spacing) * 4);\n}\n.w-5 {\n width: calc(var(--spacing) * 5);\n}\n.w-6 {\n width: calc(var(--spacing) * 6);\n}\n.w-7 {\n width: calc(var(--spacing) * 7);\n}\n.w-8 {\n width: calc(var(--spacing) * 8);\n}\n.w-9 {\n width: calc(var(--spacing) * 9);\n}\n.w-12 {\n width: calc(var(--spacing) * 12);\n}\n.w-32 {\n width: calc(var(--spacing) * 32);\n}\n.w-48 {\n width: calc(var(--spacing) * 48);\n}\n.w-fit {\n width: fit-content;\n}\n.w-full {\n width: 100%;\n}\n.w-px {\n width: 1px;\n}\n.max-w-3xl {\n max-width: var(--container-3xl);\n}\n.max-w-4xl {\n max-width: var(--container-4xl);\n}\n.max-w-5xl {\n max-width: var(--container-5xl);\n}\n.max-w-7xl {\n max-width: var(--container-7xl);\n}\n.max-w-\\[80vw\\] {\n max-width: 80vw;\n}\n.max-w-full {\n max-width: 100%;\n}\n.max-w-md {\n max-width: var(--container-md);\n}\n.max-w-xl {\n max-width: var(--container-xl);\n}\n.min-w-0 {\n min-width: calc(var(--spacing) * 0);\n}\n.min-w-\\[44px\\] {\n min-width: 44px;\n}\n.min-w-fit {\n min-width: fit-content;\n}\n.flex-1 {\n flex: 1;\n}\n.flex-shrink-0 {\n flex-shrink: 0;\n}\n.-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n}\n.scale-105 {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n}\n.rotate-180 {\n rotate: 180deg;\n}\n.transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.touch-manipulation {\n touch-action: manipulation;\n}\n.resize {\n resize: both;\n}\n.resize-y {\n resize: vertical;\n}\n.appearance-none {\n appearance: none;\n}\n.grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-center {\n align-items: center;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-start {\n align-items: flex-start;\n}\n.justify-between {\n justify-content: space-between;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-evenly {\n justify-content: space-evenly;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.gap-0 {\n gap: calc(var(--spacing) * 0);\n}\n.gap-1 {\n gap: calc(var(--spacing) * 1);\n}\n.gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n}\n.gap-2 {\n gap: calc(var(--spacing) * 2);\n}\n.gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n}\n.gap-3 {\n gap: calc(var(--spacing) * 3);\n}\n.gap-4 {\n gap: calc(var(--spacing) * 4);\n}\n.gap-5 {\n gap: calc(var(--spacing) * 5);\n}\n.gap-6 {\n gap: calc(var(--spacing) * 6);\n}\n.space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.overflow-y-visible {\n overflow-y: visible;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-2xl {\n border-radius: var(--radius-2xl);\n}\n.rounded-3xl {\n border-radius: var(--radius-3xl);\n}\n.rounded-full {\n border-radius: calc(infinity * 1px);\n}\n.rounded-lg {\n border-radius: var(--radius-lg);\n}\n.rounded-md {\n border-radius: var(--radius-md);\n}\n.rounded-xl {\n border-radius: var(--radius-xl);\n}\n.rounded-t-2xl {\n border-top-left-radius: var(--radius-2xl);\n border-top-right-radius: var(--radius-2xl);\n}\n.rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n}\n.border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n}\n.border-0 {\n border-style: var(--tw-border-style);\n border-width: 0px;\n}\n.border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n}\n.border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n}\n.border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n}\n.border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n}\n.border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n}\n.border-black\\/10 {\n border-color: color-mix(in srgb, #000 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n}\n.border-black\\/15 {\n border-color: color-mix(in srgb, #000 15%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-black) 15%, transparent);\n }\n}\n.border-black\\/20 {\n border-color: color-mix(in srgb, #000 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-black) 20%, transparent);\n }\n}\n.border-blue-200 {\n border-color: var(--color-blue-200);\n}\n.border-blue-200\\/60 {\n border-color: color-mix(in srgb, oklch(88.2% 0.059 254.128) 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-blue-200) 60%, transparent);\n }\n}\n.border-blue-300 {\n border-color: var(--color-blue-300);\n}\n.border-blue-400 {\n border-color: var(--color-blue-400);\n}\n.border-blue-600 {\n border-color: var(--color-blue-600);\n}\n.border-gray-100 {\n border-color: var(--color-gray-100);\n}\n.border-gray-200 {\n border-color: var(--color-gray-200);\n}\n.border-gray-300 {\n border-color: var(--color-gray-300);\n}\n.border-orange-500 {\n border-color: var(--color-orange-500);\n}\n.border-red-300 {\n border-color: var(--color-red-300);\n}\n.border-slate-100\\/80 {\n border-color: color-mix(in srgb, oklch(96.8% 0.007 247.896) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-slate-100) 80%, transparent);\n }\n}\n.border-slate-200 {\n border-color: var(--color-slate-200);\n}\n.border-slate-300 {\n border-color: var(--color-slate-300);\n}\n.border-transparent {\n border-color: transparent;\n}\n.border-white\\/30 {\n border-color: color-mix(in srgb, #fff 30%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-white) 30%, transparent);\n }\n}\n.border-white\\/40 {\n border-color: color-mix(in srgb, #fff 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-white) 40%, transparent);\n }\n}\n.bg-black\\/5 {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n}\n.bg-black\\/6 {\n background-color: color-mix(in srgb, #000 6%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 6%, transparent);\n }\n}\n.bg-black\\/30 {\n background-color: color-mix(in srgb, #000 30%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 30%, transparent);\n }\n}\n.bg-black\\/50 {\n background-color: color-mix(in srgb, #000 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 50%, transparent);\n }\n}\n.bg-blue-100 {\n background-color: var(--color-blue-100);\n}\n.bg-blue-100\\/50 {\n background-color: color-mix(in srgb, oklch(93.2% 0.032 255.585) 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-blue-100) 50%, transparent);\n }\n}\n.bg-blue-100\\/70 {\n background-color: color-mix(in srgb, oklch(93.2% 0.032 255.585) 70%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-blue-100) 70%, transparent);\n }\n}\n.bg-blue-400 {\n background-color: var(--color-blue-400);\n}\n.bg-blue-500 {\n background-color: var(--color-blue-500);\n}\n.bg-blue-600 {\n background-color: var(--color-blue-600);\n}\n.bg-gray-50 {\n background-color: var(--color-gray-50);\n}\n.bg-gray-100 {\n background-color: var(--color-gray-100);\n}\n.bg-gray-200 {\n background-color: var(--color-gray-200);\n}\n.bg-gray-300 {\n background-color: var(--color-gray-300);\n}\n.bg-gray-700 {\n background-color: var(--color-gray-700);\n}\n.bg-indigo-100 {\n background-color: var(--color-indigo-100);\n}\n.bg-neutral-100 {\n background-color: var(--color-neutral-100);\n}\n.bg-orange-50 {\n background-color: var(--color-orange-50);\n}\n.bg-orange-500 {\n background-color: var(--color-orange-500);\n}\n.bg-red-50 {\n background-color: var(--color-red-50);\n}\n.bg-red-100 {\n background-color: var(--color-red-100);\n}\n.bg-slate-50\\/60 {\n background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-slate-50) 60%, transparent);\n }\n}\n.bg-slate-100 {\n background-color: var(--color-slate-100);\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n background-color: var(--color-white);\n}\n.bg-white\\/70 {\n background-color: color-mix(in srgb, #fff 70%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 70%, transparent);\n }\n}\n.bg-white\\/75 {\n background-color: color-mix(in srgb, #fff 75%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 75%, transparent);\n }\n}\n.bg-gradient-to-b {\n --tw-gradient-position: to bottom in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-gradient-to-br {\n --tw-gradient-position: to bottom right in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-gradient-to-r {\n --tw-gradient-position: to right in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.from-blue-50 {\n --tw-gradient-from: var(--color-blue-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-gray-50 {\n --tw-gradient-from: var(--color-gray-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-white {\n --tw-gradient-from: var(--color-white);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-50 {\n --tw-gradient-to: var(--color-gray-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-100 {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-slate-50 {\n --tw-gradient-to: var(--color-slate-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.object-contain {\n object-fit: contain;\n}\n.p-0 {\n padding: calc(var(--spacing) * 0);\n}\n.p-1 {\n padding: calc(var(--spacing) * 1);\n}\n.p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n}\n.p-2 {\n padding: calc(var(--spacing) * 2);\n}\n.p-3 {\n padding: calc(var(--spacing) * 3);\n}\n.p-4 {\n padding: calc(var(--spacing) * 4);\n}\n.p-6 {\n padding: calc(var(--spacing) * 6);\n}\n.p-7 {\n padding: calc(var(--spacing) * 7);\n}\n.p-8 {\n padding: calc(var(--spacing) * 8);\n}\n.px-0\\.5 {\n padding-inline: calc(var(--spacing) * 0.5);\n}\n.px-2 {\n padding-inline: calc(var(--spacing) * 2);\n}\n.px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n}\n.px-3 {\n padding-inline: calc(var(--spacing) * 3);\n}\n.px-4 {\n padding-inline: calc(var(--spacing) * 4);\n}\n.px-5 {\n padding-inline: calc(var(--spacing) * 5);\n}\n.px-6 {\n padding-inline: calc(var(--spacing) * 6);\n}\n.px-8 {\n padding-inline: calc(var(--spacing) * 8);\n}\n.py-0\\.5 {\n padding-block: calc(var(--spacing) * 0.5);\n}\n.py-1 {\n padding-block: calc(var(--spacing) * 1);\n}\n.py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n}\n.py-2 {\n padding-block: calc(var(--spacing) * 2);\n}\n.py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n}\n.py-3 {\n padding-block: calc(var(--spacing) * 3);\n}\n.py-4 {\n padding-block: calc(var(--spacing) * 4);\n}\n.py-10 {\n padding-block: calc(var(--spacing) * 10);\n}\n.py-16 {\n padding-block: calc(var(--spacing) * 16);\n}\n.pt-1 {\n padding-top: calc(var(--spacing) * 1);\n}\n.pt-2 {\n padding-top: calc(var(--spacing) * 2);\n}\n.pt-3 {\n padding-top: calc(var(--spacing) * 3);\n}\n.pt-4 {\n padding-top: calc(var(--spacing) * 4);\n}\n.pt-5 {\n padding-top: calc(var(--spacing) * 5);\n}\n.pt-6 {\n padding-top: calc(var(--spacing) * 6);\n}\n.pt-8 {\n padding-top: calc(var(--spacing) * 8);\n}\n.pt-20 {\n padding-top: calc(var(--spacing) * 20);\n}\n.pr-10 {\n padding-right: calc(var(--spacing) * 10);\n}\n.pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n}\n.pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n}\n.pb-8 {\n padding-bottom: calc(var(--spacing) * 8);\n}\n.pb-20 {\n padding-bottom: calc(var(--spacing) * 20);\n}\n.pl-32 {\n padding-left: calc(var(--spacing) * 32);\n}\n.text-center {\n text-align: center;\n}\n.text-left {\n text-align: left;\n}\n.font-mono {\n font-family: var(--font-mono);\n}\n.font-sans {\n font-family: var(--font-sans);\n}\n.font-titillium {\n font-family: var(--font-titillium);\n}\n.text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n}\n.text-4xl {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n}\n.text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n}\n.text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n}\n.text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n}\n.text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n}\n.text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n}\n.leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n}\n.leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n}\n.font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n}\n.font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n}\n.font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n}\n.font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n}\n.font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n}\n.tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n}\n.tracking-wide {\n --tw-tracking: var(--tracking-wide);\n letter-spacing: var(--tracking-wide);\n}\n.break-words {\n overflow-wrap: break-word;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.whitespace-pre-wrap {\n white-space: pre-wrap;\n}\n.text-blue-500 {\n color: var(--color-blue-500);\n}\n.text-blue-600 {\n color: var(--color-blue-600);\n}\n.text-blue-800 {\n color: var(--color-blue-800);\n}\n.text-blue-900 {\n color: var(--color-blue-900);\n}\n.text-gray-300 {\n color: var(--color-gray-300);\n}\n.text-gray-400 {\n color: var(--color-gray-400);\n}\n.text-gray-500 {\n color: var(--color-gray-500);\n}\n.text-gray-600 {\n color: var(--color-gray-600);\n}\n.text-gray-700 {\n color: var(--color-gray-700);\n}\n.text-gray-800 {\n color: var(--color-gray-800);\n}\n.text-green-600 {\n color: var(--color-green-600);\n}\n.text-indigo-700 {\n color: var(--color-indigo-700);\n}\n.text-orange-700 {\n color: var(--color-orange-700);\n}\n.text-red-600 {\n color: var(--color-red-600);\n}\n.text-red-700 {\n color: var(--color-red-700);\n}\n.text-slate-500 {\n color: var(--color-slate-500);\n}\n.text-slate-600 {\n color: var(--color-slate-600);\n}\n.text-slate-700 {\n color: var(--color-slate-700);\n}\n.text-slate-900 {\n color: var(--color-slate-900);\n}\n.text-white {\n color: var(--color-white);\n}\n.uppercase {\n text-transform: uppercase;\n}\n.italic {\n font-style: italic;\n}\n.opacity-0 {\n opacity: 0%;\n}\n.opacity-70 {\n opacity: 70%;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-2xl {\n --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-2xs {\n --tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / 0.05));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.ring-blue-500 {\n --tw-ring-color: var(--color-blue-500);\n}\n.ring-offset-2 {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n}\n.invert {\n --tw-invert: invert(100%);\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.backdrop-blur-2xl {\n --tw-backdrop-blur: blur(var(--blur-2xl));\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.backdrop-blur-lg {\n --tw-backdrop-blur: blur(var(--blur-lg));\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.backdrop-blur-xl {\n --tw-backdrop-blur: blur(var(--blur-xl));\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.backdrop-saturate-150 {\n --tw-backdrop-saturate: saturate(150%);\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.transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n}\n.duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n}\n.outline-none {\n --tw-outline-style: none;\n outline-style: none;\n}\n.select-none {\n -webkit-user-select: none;\n user-select: none;\n}\n.hover\\:scale-105 {\n &:hover {\n @media (hover: hover) {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n }\n}\n.hover\\:border-blue-300 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-300);\n }\n }\n}\n.hover\\:border-blue-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-400);\n }\n }\n}\n.hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-gray-400);\n }\n }\n}\n.hover\\:border-slate-300\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in srgb, oklch(86.9% 0.022 252.894) 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-slate-300) 60%, transparent);\n }\n }\n }\n}\n.hover\\:border-white\\/50 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in srgb, #fff 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-white) 50%, transparent);\n }\n }\n }\n}\n.hover\\:border-white\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in srgb, #fff 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n }\n}\n.hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n }\n}\n.hover\\:bg-blue-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-50);\n }\n }\n}\n.hover\\:bg-blue-200\\/70 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, oklch(88.2% 0.059 254.128) 70%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-blue-200) 70%, transparent);\n }\n }\n }\n}\n.hover\\:bg-blue-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-600);\n }\n }\n}\n.hover\\:bg-blue-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-700);\n }\n }\n}\n.hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-200);\n }\n }\n}\n.hover\\:bg-orange-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-orange-600);\n }\n }\n}\n.hover\\:bg-red-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-50);\n }\n }\n}\n.hover\\:bg-red-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-200);\n }\n }\n}\n.hover\\:bg-slate-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-50);\n }\n }\n}\n.hover\\:bg-white {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-white);\n }\n }\n}\n.hover\\:bg-white\\/60 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #fff 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n }\n}\n.hover\\:bg-white\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #fff 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 80%, transparent);\n }\n }\n }\n}\n.hover\\:bg-white\\/85 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #fff 85%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 85%, transparent);\n }\n }\n }\n}\n.hover\\:bg-white\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #fff 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-white) 90%, transparent);\n }\n }\n }\n}\n.hover\\:from-blue-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-from: var(--color-blue-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:to-gray-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:text-blue-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-600);\n }\n }\n}\n.hover\\:text-blue-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-700);\n }\n }\n}\n.hover\\:text-red-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-600);\n }\n }\n}\n.hover\\:text-red-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-700);\n }\n }\n}\n.hover\\:text-slate-900 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-slate-900);\n }\n }\n}\n.hover\\:shadow {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_4px_16px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,0\\.9\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 4px 16px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,0.9));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_12px_48px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,0\\.8\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 12px 48px var(--tw-shadow-color, rgba(0,0,0,0.12)), 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,0.8));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_20px_48px_-12px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,1\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 48px -12px var(--tw-shadow-color, rgba(0,0,0,0.15)), 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-xl {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:ring-2 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:ring-gray-300 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-color: var(--color-gray-300);\n }\n }\n}\n.focus\\:border-blue-400 {\n &:focus {\n border-color: var(--color-blue-400);\n }\n}\n.focus\\:ring-0 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.focus\\:ring-1 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.focus\\:ring-blue-400 {\n &:focus {\n --tw-ring-color: var(--color-blue-400);\n }\n}\n.disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n}\n.disabled\\:opacity-40 {\n &:disabled {\n opacity: 40%;\n }\n}\n.disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n}\n.max-\\[474px\\]\\:h-\\[4\\.5rem\\] {\n @media (width < 474px) {\n height: 4.5rem;\n }\n}\n.max-\\[474px\\]\\:items-start {\n @media (width < 474px) {\n align-items: flex-start;\n }\n}\n.min-\\[475px\\]\\:flex-row {\n @media (width >= 475px) {\n flex-direction: row;\n }\n}\n.min-\\[475px\\]\\:items-center {\n @media (width >= 475px) {\n align-items: center;\n }\n}\n.min-\\[540px\\]\\:inline {\n @media (width >= 540px) {\n display: inline;\n }\n}\n.sm\\:max-w-2xl {\n @media (width >= 40rem) {\n max-width: var(--container-2xl);\n }\n}\n.sm\\:max-w-4xl {\n @media (width >= 40rem) {\n max-width: var(--container-4xl);\n }\n}\n.sm\\:grid-cols-2 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.sm\\:items-center {\n @media (width >= 40rem) {\n align-items: center;\n }\n}\n.sm\\:rounded-2xl {\n @media (width >= 40rem) {\n border-radius: var(--radius-2xl);\n }\n}\n.md\\:mt-4 {\n @media (width >= 48rem) {\n margin-top: calc(var(--spacing) * 4);\n }\n}\n.md\\:w-80 {\n @media (width >= 48rem) {\n width: calc(var(--spacing) * 80);\n }\n}\n.md\\:max-w-\\[75vw\\] {\n @media (width >= 48rem) {\n max-width: 75vw;\n }\n}\n.md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.md\\:flex-row {\n @media (width >= 48rem) {\n flex-direction: row;\n }\n}\n.md\\:px-12 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--spacing) * 12);\n }\n}\n.md\\:text-5xl {\n @media (width >= 48rem) {\n font-size: var(--text-5xl);\n line-height: var(--tw-leading, var(--text-5xl--line-height));\n }\n}\n.lg\\:mt-6 {\n @media (width >= 64rem) {\n margin-top: calc(var(--spacing) * 6);\n }\n}\n.lg\\:block {\n @media (width >= 64rem) {\n display: block;\n }\n}\n.lg\\:flex {\n @media (width >= 64rem) {\n display: flex;\n }\n}\n.lg\\:hidden {\n @media (width >= 64rem) {\n display: none;\n }\n}\n.lg\\:h-4 {\n @media (width >= 64rem) {\n height: calc(var(--spacing) * 4);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-11rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 11rem);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-20rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 20rem);\n }\n}\n.lg\\:w-4 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 4);\n }\n}\n.lg\\:w-72 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 72);\n }\n}\n.lg\\:w-90 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 90);\n }\n}\n.lg\\:max-w-full {\n @media (width >= 64rem) {\n max-width: 100%;\n }\n}\n.lg\\:grid-cols-2 {\n @media (width >= 64rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.lg\\:flex-row {\n @media (width >= 64rem) {\n flex-direction: row;\n }\n}\n.lg\\:items-center {\n @media (width >= 64rem) {\n align-items: center;\n }\n}\n.lg\\:justify-center {\n @media (width >= 64rem) {\n justify-content: center;\n }\n}\n.lg\\:gap-2 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 2);\n }\n}\n.lg\\:gap-3 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-3 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-4 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 4);\n }\n}\n.lg\\:px-6 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 6);\n }\n}\n.lg\\:py-2 {\n @media (width >= 64rem) {\n padding-block: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pr-2 {\n @media (width >= 64rem) {\n padding-right: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pb-4 {\n @media (width >= 64rem) {\n padding-bottom: calc(var(--spacing) * 4);\n }\n}\n.lg\\:text-2xl {\n @media (width >= 64rem) {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n}\n.lg\\:text-sm {\n @media (width >= 64rem) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:max-h-none {\n & .edit-panel-container {\n max-height: none;\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:overflow-visible {\n & .edit-panel-container {\n overflow: visible;\n }\n}\n:root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji';\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --color-red-50: oklch(97.1% 0.013 17.38);\n --color-red-100: oklch(93.6% 0.032 17.717);\n --color-red-200: oklch(88.5% 0.062 18.334);\n --color-red-300: oklch(80.8% 0.114 19.571);\n --color-red-600: oklch(57.7% 0.245 27.325);\n --color-red-700: oklch(50.5% 0.213 27.518);\n --color-orange-50: oklch(98% 0.016 73.684);\n --color-orange-500: oklch(70.5% 0.213 47.604);\n --color-orange-600: oklch(64.6% 0.222 41.116);\n --color-orange-700: oklch(55.3% 0.195 38.402);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-blue-50: oklch(97% 0.014 254.604);\n --color-blue-100: oklch(93.2% 0.032 255.585);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-300: oklch(80.9% 0.105 251.813);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-blue-500: oklch(62.3% 0.214 259.815);\n --color-blue-600: oklch(54.6% 0.245 262.881);\n --color-blue-700: oklch(48.8% 0.243 264.376);\n --color-blue-800: oklch(42.4% 0.199 265.638);\n --color-blue-900: oklch(37.9% 0.146 265.522);\n --color-indigo-100: oklch(93% 0.034 272.788);\n --color-indigo-700: oklch(45.7% 0.24 277.023);\n --color-slate-50: oklch(98.4% 0.003 247.858);\n --color-slate-100: oklch(96.8% 0.007 247.896);\n --color-slate-200: oklch(92.9% 0.013 255.508);\n --color-slate-300: oklch(86.9% 0.022 252.894);\n --color-slate-500: oklch(55.4% 0.046 257.417);\n --color-slate-600: oklch(44.6% 0.043 257.281);\n --color-slate-700: oklch(37.2% 0.044 257.287);\n --color-slate-900: oklch(20.8% 0.042 265.755);\n --color-gray-50: oklch(98.5% 0.002 247.839);\n --color-gray-100: oklch(96.7% 0.003 264.542);\n --color-gray-200: oklch(92.8% 0.006 264.531);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-500: oklch(55.1% 0.027 264.364);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-gray-700: oklch(37.3% 0.034 259.733);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-neutral-100: oklch(97% 0 0);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --container-xl: 36rem;\n --container-2xl: 42rem;\n --container-3xl: 48rem;\n --container-4xl: 56rem;\n --container-5xl: 64rem;\n --container-7xl: 80rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --text-4xl: 2.25rem;\n --text-4xl--line-height: calc(2.5 / 2.25);\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --tracking-tight: -0.025em;\n --tracking-wide: 0.025em;\n --leading-tight: 1.25;\n --leading-relaxed: 1.625;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --radius-xl: 0.75rem;\n --radius-2xl: 1rem;\n --radius-3xl: 1.5rem;\n --blur-lg: 16px;\n --blur-xl: 24px;\n --blur-2xl: 40px;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --font-titillium: \"Titillium Web\", sans-serif;\n}\ndiv:focus-visible, button:focus-visible {\n outline: none;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root {\n color-scheme: dark;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-white {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-50 {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-100 {\n background-color: #363c42 !important;\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-drop-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-gradient-position: initial;\n --tw-gradient-from: #0000;\n --tw-gradient-via: #0000;\n --tw-gradient-to: #0000;\n --tw-gradient-stops: initial;\n --tw-gradient-via-stops: initial;\n --tw-gradient-from-position: 0%;\n --tw-gradient-via-position: 50%;\n --tw-gradient-to-position: 100%;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n }\n }\n}\n";
|
|
8
|
+
style.textContent = "/*! tailwindcss v4.0.6 | MIT License | https://tailwindcss.com */\n@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');\n.pointer-events-none {\n pointer-events: none;\n}\n.\\!visible {\n visibility: visible !important;\n}\n.collapse {\n visibility: collapse;\n}\n.visible {\n visibility: visible;\n}\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n.absolute {\n position: absolute;\n}\n.fixed {\n position: fixed;\n}\n.relative {\n position: relative;\n}\n.static {\n position: static;\n}\n.sticky {\n position: sticky;\n}\n.inset-0 {\n inset: calc(var(--spacing) * 0);\n}\n.-top-\\[20\\%\\] {\n top: calc(20% * -1);\n}\n.top-0 {\n top: calc(var(--spacing) * 0);\n}\n.top-1\\/2 {\n top: calc(1/2 * 100%);\n}\n.top-2 {\n top: calc(var(--spacing) * 2);\n}\n.top-3 {\n top: calc(var(--spacing) * 3);\n}\n.top-4 {\n top: calc(var(--spacing) * 4);\n}\n.top-6 {\n top: calc(var(--spacing) * 6);\n}\n.top-11 {\n top: calc(var(--spacing) * 11);\n}\n.top-\\[10\\%\\] {\n top: 10%;\n}\n.top-full {\n top: 100%;\n}\n.-right-\\[10\\%\\] {\n right: calc(10% * -1);\n}\n.right-0 {\n right: calc(var(--spacing) * 0);\n}\n.right-2 {\n right: calc(var(--spacing) * 2);\n}\n.right-3 {\n right: calc(var(--spacing) * 3);\n}\n.right-4 {\n right: calc(var(--spacing) * 4);\n}\n.bottom-0 {\n bottom: calc(var(--spacing) * 0);\n}\n.bottom-5 {\n bottom: calc(var(--spacing) * 5);\n}\n.bottom-full {\n bottom: 100%;\n}\n.-left-2 {\n left: calc(var(--spacing) * -2);\n}\n.-left-\\[10\\%\\] {\n left: calc(10% * -1);\n}\n.left-0 {\n left: calc(var(--spacing) * 0);\n}\n.left-5 {\n left: calc(var(--spacing) * 5);\n}\n.z-10 {\n z-index: 10;\n}\n.z-20 {\n z-index: 20;\n}\n.z-40 {\n z-index: 40;\n}\n.z-50 {\n z-index: 50;\n}\n.z-60 {\n z-index: 60;\n}\n.z-9999 {\n z-index: 9999;\n}\n.\\!container {\n width: 100% !important;\n @media (width >= 40rem) {\n max-width: 40rem !important;\n }\n @media (width >= 48rem) {\n max-width: 48rem !important;\n }\n @media (width >= 64rem) {\n max-width: 64rem !important;\n }\n @media (width >= 80rem) {\n max-width: 80rem !important;\n }\n @media (width >= 96rem) {\n max-width: 96rem !important;\n }\n}\n.container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n}\n.m-0 {\n margin: calc(var(--spacing) * 0);\n}\n.-mx-6 {\n margin-inline: calc(var(--spacing) * -6);\n}\n.mx-auto {\n margin-inline: auto;\n}\n.my-2 {\n margin-block: calc(var(--spacing) * 2);\n}\n.my-9 {\n margin-block: calc(var(--spacing) * 9);\n}\n.-mt-6 {\n margin-top: calc(var(--spacing) * -6);\n}\n.mt-0 {\n margin-top: calc(var(--spacing) * 0);\n}\n.mt-1 {\n margin-top: calc(var(--spacing) * 1);\n}\n.mt-2 {\n margin-top: calc(var(--spacing) * 2);\n}\n.mt-3 {\n margin-top: calc(var(--spacing) * 3);\n}\n.mt-4 {\n margin-top: calc(var(--spacing) * 4);\n}\n.mt-5 {\n margin-top: calc(var(--spacing) * 5);\n}\n.mt-8 {\n margin-top: calc(var(--spacing) * 8);\n}\n.mt-12 {\n margin-top: calc(var(--spacing) * 12);\n}\n.mr-2 {\n margin-right: calc(var(--spacing) * 2);\n}\n.mb-0 {\n margin-bottom: calc(var(--spacing) * 0);\n}\n.mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n}\n.mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n}\n.mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n}\n.mb-2\\.5 {\n margin-bottom: calc(var(--spacing) * 2.5);\n}\n.mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n}\n.mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n}\n.mb-5 {\n margin-bottom: calc(var(--spacing) * 5);\n}\n.mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n}\n.mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n}\n.mb-10 {\n margin-bottom: calc(var(--spacing) * 10);\n}\n.mb-12 {\n margin-bottom: calc(var(--spacing) * 12);\n}\n.mb-14 {\n margin-bottom: calc(var(--spacing) * 14);\n}\n.mb-16 {\n margin-bottom: calc(var(--spacing) * 16);\n}\n.mb-20 {\n margin-bottom: calc(var(--spacing) * 20);\n}\n.ml-2 {\n margin-left: calc(var(--spacing) * 2);\n}\n.ml-auto {\n margin-left: auto;\n}\n.block {\n display: block;\n}\n.contents {\n display: contents;\n}\n.flex {\n display: flex;\n}\n.grid {\n display: grid;\n}\n.hidden {\n display: none;\n}\n.inline {\n display: inline;\n}\n.inline-block {\n display: inline-block;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.h-1 {\n height: calc(var(--spacing) * 1);\n}\n.h-3 {\n height: calc(var(--spacing) * 3);\n}\n.h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n}\n.h-4 {\n height: calc(var(--spacing) * 4);\n}\n.h-5 {\n height: calc(var(--spacing) * 5);\n}\n.h-6 {\n height: calc(var(--spacing) * 6);\n}\n.h-7 {\n height: calc(var(--spacing) * 7);\n}\n.h-8 {\n height: calc(var(--spacing) * 8);\n}\n.h-9 {\n height: calc(var(--spacing) * 9);\n}\n.h-10 {\n height: calc(var(--spacing) * 10);\n}\n.h-11 {\n height: calc(var(--spacing) * 11);\n}\n.h-12 {\n height: calc(var(--spacing) * 12);\n}\n.h-16 {\n height: calc(var(--spacing) * 16);\n}\n.h-24 {\n height: calc(var(--spacing) * 24);\n}\n.h-72 {\n height: calc(var(--spacing) * 72);\n}\n.h-\\[60\\%\\] {\n height: 60%;\n}\n.h-\\[80\\%\\] {\n height: 80%;\n}\n.h-auto {\n height: auto;\n}\n.h-fit {\n height: fit-content;\n}\n.h-full {\n height: 100%;\n}\n.h-screen {\n height: 100vh;\n}\n.max-h-48 {\n max-height: calc(var(--spacing) * 48);\n}\n.max-h-56 {\n max-height: calc(var(--spacing) * 56);\n}\n.max-h-60 {\n max-height: calc(var(--spacing) * 60);\n}\n.max-h-64 {\n max-height: calc(var(--spacing) * 64);\n}\n.max-h-75 {\n max-height: calc(var(--spacing) * 75);\n}\n.max-h-96 {\n max-height: calc(var(--spacing) * 96);\n}\n.max-h-\\[60vh\\] {\n max-height: 60vh;\n}\n.max-h-\\[calc\\(100svh-13rem\\)\\] {\n max-height: calc(100svh - 13rem);\n}\n.max-h-\\[calc\\(100svh-24rem\\)\\] {\n max-height: calc(100svh - 24rem);\n}\n.max-h-screen {\n max-height: 100vh;\n}\n.min-h-10 {\n min-height: calc(var(--spacing) * 10);\n}\n.min-h-24 {\n min-height: calc(var(--spacing) * 24);\n}\n.min-h-64 {\n min-height: calc(var(--spacing) * 64);\n}\n.min-h-\\[calc\\(100vh-10rem\\)\\] {\n min-height: calc(100vh - 10rem);\n}\n.min-h-\\[calc\\(100vh-85px\\)\\] {\n min-height: calc(100vh - 85px);\n}\n.min-h-dvh {\n min-height: 100dvh;\n}\n.min-h-screen {\n min-height: 100vh;\n}\n.w-1\\/2 {\n width: calc(1/2 * 100%);\n}\n.w-3 {\n width: calc(var(--spacing) * 3);\n}\n.w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n}\n.w-3\\/4 {\n width: calc(3/4 * 100%);\n}\n.w-4 {\n width: calc(var(--spacing) * 4);\n}\n.w-5 {\n width: calc(var(--spacing) * 5);\n}\n.w-6 {\n width: calc(var(--spacing) * 6);\n}\n.w-7 {\n width: calc(var(--spacing) * 7);\n}\n.w-8 {\n width: calc(var(--spacing) * 8);\n}\n.w-9 {\n width: calc(var(--spacing) * 9);\n}\n.w-12 {\n width: calc(var(--spacing) * 12);\n}\n.w-16 {\n width: calc(var(--spacing) * 16);\n}\n.w-20 {\n width: calc(var(--spacing) * 20);\n}\n.w-32 {\n width: calc(var(--spacing) * 32);\n}\n.w-48 {\n width: calc(var(--spacing) * 48);\n}\n.w-\\[40\\%\\] {\n width: 40%;\n}\n.w-\\[50\\%\\] {\n width: 50%;\n}\n.w-fit {\n width: fit-content;\n}\n.w-full {\n width: 100%;\n}\n.w-px {\n width: 1px;\n}\n.max-w-2xl {\n max-width: var(--container-2xl);\n}\n.max-w-3xl {\n max-width: var(--container-3xl);\n}\n.max-w-4xl {\n max-width: var(--container-4xl);\n}\n.max-w-5xl {\n max-width: var(--container-5xl);\n}\n.max-w-7xl {\n max-width: var(--container-7xl);\n}\n.max-w-\\[80vw\\] {\n max-width: 80vw;\n}\n.max-w-full {\n max-width: 100%;\n}\n.max-w-md {\n max-width: var(--container-md);\n}\n.max-w-xl {\n max-width: var(--container-xl);\n}\n.min-w-0 {\n min-width: calc(var(--spacing) * 0);\n}\n.min-w-\\[44px\\] {\n min-width: 44px;\n}\n.min-w-fit {\n min-width: fit-content;\n}\n.flex-1 {\n flex: 1;\n}\n.flex-shrink-0 {\n flex-shrink: 0;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n}\n.scale-105 {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n}\n.rotate-180 {\n rotate: 180deg;\n}\n.transform {\n transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.touch-manipulation {\n touch-action: manipulation;\n}\n.resize {\n resize: both;\n}\n.resize-y {\n resize: vertical;\n}\n.appearance-none {\n appearance: none;\n}\n.grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-center {\n align-items: center;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-start {\n align-items: flex-start;\n}\n.justify-between {\n justify-content: space-between;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-evenly {\n justify-content: space-evenly;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.gap-0 {\n gap: calc(var(--spacing) * 0);\n}\n.gap-1 {\n gap: calc(var(--spacing) * 1);\n}\n.gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n}\n.gap-2 {\n gap: calc(var(--spacing) * 2);\n}\n.gap-3 {\n gap: calc(var(--spacing) * 3);\n}\n.gap-4 {\n gap: calc(var(--spacing) * 4);\n}\n.gap-5 {\n gap: calc(var(--spacing) * 5);\n}\n.gap-6 {\n gap: calc(var(--spacing) * 6);\n}\n.gap-8 {\n gap: calc(var(--spacing) * 8);\n}\n.space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.overflow-y-visible {\n overflow-y: visible;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-2xl {\n border-radius: var(--radius-2xl);\n}\n.rounded-3xl {\n border-radius: var(--radius-3xl);\n}\n.rounded-full {\n border-radius: calc(infinity * 1px);\n}\n.rounded-lg {\n border-radius: var(--radius-lg);\n}\n.rounded-md {\n border-radius: var(--radius-md);\n}\n.rounded-xl {\n border-radius: var(--radius-xl);\n}\n.rounded-t-2xl {\n border-top-left-radius: var(--radius-2xl);\n border-top-right-radius: var(--radius-2xl);\n}\n.rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n}\n.border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n}\n.border-0 {\n border-style: var(--tw-border-style);\n border-width: 0px;\n}\n.border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n}\n.border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n}\n.border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n}\n.border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n}\n.border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n}\n.border-black\\/15 {\n border-color: color-mix(in oklab, var(--color-black) 15%, transparent);\n}\n.border-black\\/20 {\n border-color: color-mix(in oklab, var(--color-black) 20%, transparent);\n}\n.border-blue-200 {\n border-color: var(--color-blue-200);\n}\n.border-blue-200\\/60 {\n border-color: color-mix(in oklab, var(--color-blue-200) 60%, transparent);\n}\n.border-blue-300 {\n border-color: var(--color-blue-300);\n}\n.border-blue-400 {\n border-color: var(--color-blue-400);\n}\n.border-blue-600 {\n border-color: var(--color-blue-600);\n}\n.border-gray-100 {\n border-color: var(--color-gray-100);\n}\n.border-gray-200 {\n border-color: var(--color-gray-200);\n}\n.border-gray-300 {\n border-color: var(--color-gray-300);\n}\n.border-green-200 {\n border-color: var(--color-green-200);\n}\n.border-orange-500 {\n border-color: var(--color-orange-500);\n}\n.border-red-200 {\n border-color: var(--color-red-200);\n}\n.border-red-300 {\n border-color: var(--color-red-300);\n}\n.border-slate-100\\/80 {\n border-color: color-mix(in oklab, var(--color-slate-100) 80%, transparent);\n}\n.border-slate-200 {\n border-color: var(--color-slate-200);\n}\n.border-slate-300 {\n border-color: var(--color-slate-300);\n}\n.border-slate-700 {\n border-color: var(--color-slate-700);\n}\n.border-transparent {\n border-color: transparent;\n}\n.border-white\\/30 {\n border-color: color-mix(in oklab, var(--color-white) 30%, transparent);\n}\n.border-white\\/40 {\n border-color: color-mix(in oklab, var(--color-white) 40%, transparent);\n}\n.bg-black\\/5 {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n}\n.bg-black\\/30 {\n background-color: color-mix(in oklab, var(--color-black) 30%, transparent);\n}\n.bg-black\\/50 {\n background-color: color-mix(in oklab, var(--color-black) 50%, transparent);\n}\n.bg-blue-50 {\n background-color: var(--color-blue-50);\n}\n.bg-blue-100 {\n background-color: var(--color-blue-100);\n}\n.bg-blue-100\\/50 {\n background-color: color-mix(in oklab, var(--color-blue-100) 50%, transparent);\n}\n.bg-blue-100\\/70 {\n background-color: color-mix(in oklab, var(--color-blue-100) 70%, transparent);\n}\n.bg-blue-200\\/40 {\n background-color: color-mix(in oklab, var(--color-blue-200) 40%, transparent);\n}\n.bg-blue-400 {\n background-color: var(--color-blue-400);\n}\n.bg-blue-500 {\n background-color: var(--color-blue-500);\n}\n.bg-blue-600 {\n background-color: var(--color-blue-600);\n}\n.bg-gray-50 {\n background-color: var(--color-gray-50);\n}\n.bg-gray-100 {\n background-color: var(--color-gray-100);\n}\n.bg-gray-200 {\n background-color: var(--color-gray-200);\n}\n.bg-gray-300 {\n background-color: var(--color-gray-300);\n}\n.bg-gray-700 {\n background-color: var(--color-gray-700);\n}\n.bg-green-50 {\n background-color: var(--color-green-50);\n}\n.bg-green-100 {\n background-color: var(--color-green-100);\n}\n.bg-green-200\\/40 {\n background-color: color-mix(in oklab, var(--color-green-200) 40%, transparent);\n}\n.bg-indigo-100 {\n background-color: var(--color-indigo-100);\n}\n.bg-neutral-100 {\n background-color: var(--color-neutral-100);\n}\n.bg-orange-50 {\n background-color: var(--color-orange-50);\n}\n.bg-orange-500 {\n background-color: var(--color-orange-500);\n}\n.bg-red-50 {\n background-color: var(--color-red-50);\n}\n.bg-red-100 {\n background-color: var(--color-red-100);\n}\n.bg-slate-50 {\n background-color: var(--color-slate-50);\n}\n.bg-slate-50\\/60 {\n background-color: color-mix(in oklab, var(--color-slate-50) 60%, transparent);\n}\n.bg-slate-100 {\n background-color: var(--color-slate-100);\n}\n.bg-slate-800 {\n background-color: var(--color-slate-800);\n}\n.bg-slate-900 {\n background-color: var(--color-slate-900);\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n background-color: var(--color-white);\n}\n.bg-white\\/70 {\n background-color: color-mix(in oklab, var(--color-white) 70%, transparent);\n}\n.bg-white\\/75 {\n background-color: color-mix(in oklab, var(--color-white) 75%, transparent);\n}\n.bg-gradient-to-b {\n --tw-gradient-position: to bottom in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-gradient-to-r {\n --tw-gradient-position: to right in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-linear-\\[to_right\\,\\#059669\\,\\#0891b2_30\\%\\,\\#f59e0b_60\\%\\,\\#22c55e\\] {\n --tw-gradient-position: to right,#059669,#0891b2 30%,#f59e0b 60%,#22c55e;\n background-image: linear-gradient(var(--tw-gradient-stops,to right,#059669,#0891b2 30%,#f59e0b 60%,#22c55e));\n}\n.bg-linear-to-b {\n --tw-gradient-position: to bottom in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-linear-to-br {\n --tw-gradient-position: to bottom right in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.from-blue-50 {\n --tw-gradient-from: var(--color-blue-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-gray-50 {\n --tw-gradient-from: var(--color-gray-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-slate-50 {\n --tw-gradient-from: var(--color-slate-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-white {\n --tw-gradient-from: var(--color-white);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-50 {\n --tw-gradient-to: var(--color-gray-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-100 {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-slate-50 {\n --tw-gradient-to: var(--color-slate-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-white {\n --tw-gradient-to: var(--color-white);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.bg-clip-text {\n background-clip: text;\n}\n.object-contain {\n object-fit: contain;\n}\n.p-0 {\n padding: calc(var(--spacing) * 0);\n}\n.p-1 {\n padding: calc(var(--spacing) * 1);\n}\n.p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n}\n.p-2 {\n padding: calc(var(--spacing) * 2);\n}\n.p-3 {\n padding: calc(var(--spacing) * 3);\n}\n.p-4 {\n padding: calc(var(--spacing) * 4);\n}\n.p-6 {\n padding: calc(var(--spacing) * 6);\n}\n.p-7 {\n padding: calc(var(--spacing) * 7);\n}\n.p-8 {\n padding: calc(var(--spacing) * 8);\n}\n.px-0 {\n padding-inline: calc(var(--spacing) * 0);\n}\n.px-0\\.5 {\n padding-inline: calc(var(--spacing) * 0.5);\n}\n.px-2 {\n padding-inline: calc(var(--spacing) * 2);\n}\n.px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n}\n.px-3 {\n padding-inline: calc(var(--spacing) * 3);\n}\n.px-4 {\n padding-inline: calc(var(--spacing) * 4);\n}\n.px-5 {\n padding-inline: calc(var(--spacing) * 5);\n}\n.px-6 {\n padding-inline: calc(var(--spacing) * 6);\n}\n.px-8 {\n padding-inline: calc(var(--spacing) * 8);\n}\n.py-0\\.5 {\n padding-block: calc(var(--spacing) * 0.5);\n}\n.py-1 {\n padding-block: calc(var(--spacing) * 1);\n}\n.py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n}\n.py-2 {\n padding-block: calc(var(--spacing) * 2);\n}\n.py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n}\n.py-3 {\n padding-block: calc(var(--spacing) * 3);\n}\n.py-4 {\n padding-block: calc(var(--spacing) * 4);\n}\n.py-10 {\n padding-block: calc(var(--spacing) * 10);\n}\n.py-16 {\n padding-block: calc(var(--spacing) * 16);\n}\n.py-20 {\n padding-block: calc(var(--spacing) * 20);\n}\n.pt-1 {\n padding-top: calc(var(--spacing) * 1);\n}\n.pt-2 {\n padding-top: calc(var(--spacing) * 2);\n}\n.pt-3 {\n padding-top: calc(var(--spacing) * 3);\n}\n.pt-4 {\n padding-top: calc(var(--spacing) * 4);\n}\n.pt-5 {\n padding-top: calc(var(--spacing) * 5);\n}\n.pt-6 {\n padding-top: calc(var(--spacing) * 6);\n}\n.pt-8 {\n padding-top: calc(var(--spacing) * 8);\n}\n.pt-20 {\n padding-top: calc(var(--spacing) * 20);\n}\n.pt-32 {\n padding-top: calc(var(--spacing) * 32);\n}\n.pr-10 {\n padding-right: calc(var(--spacing) * 10);\n}\n.pr-28 {\n padding-right: calc(var(--spacing) * 28);\n}\n.pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n}\n.pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n}\n.pb-8 {\n padding-bottom: calc(var(--spacing) * 8);\n}\n.pb-20 {\n padding-bottom: calc(var(--spacing) * 20);\n}\n.pl-32 {\n padding-left: calc(var(--spacing) * 32);\n}\n.text-center {\n text-align: center;\n}\n.text-left {\n text-align: left;\n}\n.font-mono {\n font-family: var(--font-mono);\n}\n.font-sans {\n font-family: var(--font-sans);\n}\n.font-titillium {\n font-family: var(--font-titillium);\n}\n.text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n}\n.text-4xl {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n}\n.text-7xl {\n font-size: var(--text-7xl);\n line-height: var(--tw-leading, var(--text-7xl--line-height));\n}\n.text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n}\n.text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n}\n.text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n}\n.text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n}\n.text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n}\n.leading-none {\n --tw-leading: 1;\n line-height: 1;\n}\n.leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n}\n.leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n}\n.font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n}\n.font-extrabold {\n --tw-font-weight: var(--font-weight-extrabold);\n font-weight: var(--font-weight-extrabold);\n}\n.font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n}\n.font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n}\n.font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n}\n.font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n}\n.tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n}\n.tracking-wide {\n --tw-tracking: var(--tracking-wide);\n letter-spacing: var(--tracking-wide);\n}\n.break-words {\n overflow-wrap: break-word;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-blue-500 {\n color: var(--color-blue-500);\n}\n.text-blue-600 {\n color: var(--color-blue-600);\n}\n.text-blue-800 {\n color: var(--color-blue-800);\n}\n.text-blue-900 {\n color: var(--color-blue-900);\n}\n.text-gray-300 {\n color: var(--color-gray-300);\n}\n.text-gray-400 {\n color: var(--color-gray-400);\n}\n.text-gray-500 {\n color: var(--color-gray-500);\n}\n.text-gray-600 {\n color: var(--color-gray-600);\n}\n.text-gray-700 {\n color: var(--color-gray-700);\n}\n.text-gray-800 {\n color: var(--color-gray-800);\n}\n.text-gray-900 {\n color: var(--color-gray-900);\n}\n.text-green-600 {\n color: var(--color-green-600);\n}\n.text-green-700 {\n color: var(--color-green-700);\n}\n.text-indigo-700 {\n color: var(--color-indigo-700);\n}\n.text-orange-700 {\n color: var(--color-orange-700);\n}\n.text-red-600 {\n color: var(--color-red-600);\n}\n.text-red-700 {\n color: var(--color-red-700);\n}\n.text-slate-100 {\n color: var(--color-slate-100);\n}\n.text-slate-300 {\n color: var(--color-slate-300);\n}\n.text-slate-400 {\n color: var(--color-slate-400);\n}\n.text-slate-500 {\n color: var(--color-slate-500);\n}\n.text-slate-600 {\n color: var(--color-slate-600);\n}\n.text-slate-700 {\n color: var(--color-slate-700);\n}\n.text-slate-800 {\n color: var(--color-slate-800);\n}\n.text-slate-900 {\n color: var(--color-slate-900);\n}\n.text-transparent {\n color: transparent;\n}\n.text-white {\n color: var(--color-white);\n}\n.uppercase {\n text-transform: uppercase;\n}\n.italic {\n font-style: italic;\n}\n.no-underline {\n text-decoration-line: none;\n}\n.opacity-0 {\n opacity: 0%;\n}\n.opacity-50 {\n opacity: 50%;\n}\n.ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-2xl {\n --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.ring-blue-500 {\n --tw-ring-color: var(--color-blue-500);\n}\n.ring-offset-2 {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n}\n.blur-\\[96px\\] {\n --tw-blur: blur(96px);\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.invert {\n --tw-invert: invert(100%);\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.filter {\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.backdrop-blur-2xl {\n --tw-backdrop-blur: blur(var(--blur-2xl));\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.backdrop-blur-lg {\n --tw-backdrop-blur: blur(var(--blur-lg));\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.backdrop-blur-xl {\n --tw-backdrop-blur: blur(var(--blur-xl));\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.backdrop-saturate-150 {\n --tw-backdrop-saturate: saturate(150%);\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.transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n}\n.duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n}\n.outline-none {\n --tw-outline-style: none;\n outline-style: none;\n}\n.select-none {\n -webkit-user-select: none;\n user-select: none;\n}\n.group-hover\\:text-green-600 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n color: var(--color-green-600);\n }\n }\n}\n.hover\\:translate-y-1 {\n &:hover {\n @media (hover: hover) {\n --tw-translate-y: calc(var(--spacing) * 1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n }\n}\n.hover\\:scale-105 {\n &:hover {\n @media (hover: hover) {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n }\n}\n.hover\\:border-blue-300 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-300);\n }\n }\n}\n.hover\\:border-blue-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-400);\n }\n }\n}\n.hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-gray-400);\n }\n }\n}\n.hover\\:border-green-500 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-green-500);\n }\n }\n}\n.hover\\:border-slate-300\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-slate-300) 60%, transparent);\n }\n }\n}\n.hover\\:border-slate-600 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-slate-600);\n }\n }\n}\n.hover\\:border-white\\/50 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-white) 50%, transparent);\n }\n }\n}\n.hover\\:border-white\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n}\n.hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n}\n.hover\\:bg-blue-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-50);\n }\n }\n}\n.hover\\:bg-blue-200\\/70 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-blue-200) 70%, transparent);\n }\n }\n}\n.hover\\:bg-blue-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-600);\n }\n }\n}\n.hover\\:bg-blue-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-700);\n }\n }\n}\n.hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-200);\n }\n }\n}\n.hover\\:bg-gray-300 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-300);\n }\n }\n}\n.hover\\:bg-orange-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-orange-600);\n }\n }\n}\n.hover\\:bg-red-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-50);\n }\n }\n}\n.hover\\:bg-red-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-200);\n }\n }\n}\n.hover\\:bg-slate-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-50);\n }\n }\n}\n.hover\\:bg-slate-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-700);\n }\n }\n}\n.hover\\:bg-white {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-white);\n }\n }\n}\n.hover\\:bg-white\\/60 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 80%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/85 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 85%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 90%, transparent);\n }\n }\n}\n.hover\\:from-blue-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-from: var(--color-blue-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:to-gray-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:text-blue-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-600);\n }\n }\n}\n.hover\\:text-blue-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-700);\n }\n }\n}\n.hover\\:text-green-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-green-700);\n }\n }\n}\n.hover\\:text-red-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-600);\n }\n }\n}\n.hover\\:text-red-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-700);\n }\n }\n}\n.hover\\:text-slate-100 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-slate-100);\n }\n }\n}\n.hover\\:text-slate-900 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-slate-900);\n }\n }\n}\n.hover\\:ring-2 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_4px_16px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,0\\.9\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 4px 16px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,0.9));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_12px_48px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,0\\.8\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 12px 48px var(--tw-shadow-color, rgba(0,0,0,0.12)), 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,0.8));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-\\[0_20px_48px_-12px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,1\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 48px -12px var(--tw-shadow-color, rgba(0,0,0,0.15)), 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-lg {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-xl {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:ring-gray-300 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-color: var(--color-gray-300);\n }\n }\n}\n.focus\\:border-blue-400 {\n &:focus {\n border-color: var(--color-blue-400);\n }\n}\n.focus\\:ring-1 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.focus\\:ring-blue-400 {\n &:focus {\n --tw-ring-color: var(--color-blue-400);\n }\n}\n.focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n}\n.active\\:bg-slate-600 {\n &:active {\n background-color: var(--color-slate-600);\n }\n}\n.disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n}\n.disabled\\:opacity-40 {\n &:disabled {\n opacity: 40%;\n }\n}\n.disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n}\n.min-\\[445px\\]\\:inline {\n @media (width >= 445px) {\n display: inline;\n }\n}\n.sm\\:grid-cols-2 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.md\\:mt-4 {\n @media (width >= 48rem) {\n margin-top: calc(var(--spacing) * 4);\n }\n}\n.md\\:w-80 {\n @media (width >= 48rem) {\n width: calc(var(--spacing) * 80);\n }\n}\n.md\\:max-w-\\[75vw\\] {\n @media (width >= 48rem) {\n max-width: 75vw;\n }\n}\n.md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.md\\:grid-cols-3 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n}\n.md\\:flex-row {\n @media (width >= 48rem) {\n flex-direction: row;\n }\n}\n.md\\:px-12 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--spacing) * 12);\n }\n}\n.md\\:text-5xl {\n @media (width >= 48rem) {\n font-size: var(--text-5xl);\n line-height: var(--tw-leading, var(--text-5xl--line-height));\n }\n}\n.lg\\:mt-6 {\n @media (width >= 64rem) {\n margin-top: calc(var(--spacing) * 6);\n }\n}\n.lg\\:block {\n @media (width >= 64rem) {\n display: block;\n }\n}\n.lg\\:flex {\n @media (width >= 64rem) {\n display: flex;\n }\n}\n.lg\\:hidden {\n @media (width >= 64rem) {\n display: none;\n }\n}\n.lg\\:h-4 {\n @media (width >= 64rem) {\n height: calc(var(--spacing) * 4);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-11rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 11rem);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-20rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 20rem);\n }\n}\n.lg\\:w-4 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 4);\n }\n}\n.lg\\:w-72 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 72);\n }\n}\n.lg\\:w-90 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 90);\n }\n}\n.lg\\:max-w-full {\n @media (width >= 64rem) {\n max-width: 100%;\n }\n}\n.lg\\:grid-cols-2 {\n @media (width >= 64rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.lg\\:flex-row {\n @media (width >= 64rem) {\n flex-direction: row;\n }\n}\n.lg\\:items-center {\n @media (width >= 64rem) {\n align-items: center;\n }\n}\n.lg\\:justify-center {\n @media (width >= 64rem) {\n justify-content: center;\n }\n}\n.lg\\:gap-2 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 2);\n }\n}\n.lg\\:gap-3 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-3 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-4 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 4);\n }\n}\n.lg\\:px-6 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 6);\n }\n}\n.lg\\:py-2 {\n @media (width >= 64rem) {\n padding-block: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pr-2 {\n @media (width >= 64rem) {\n padding-right: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pb-4 {\n @media (width >= 64rem) {\n padding-bottom: calc(var(--spacing) * 4);\n }\n}\n.lg\\:text-2xl {\n @media (width >= 64rem) {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n}\n.lg\\:text-9xl {\n @media (width >= 64rem) {\n font-size: var(--text-9xl);\n line-height: var(--tw-leading, var(--text-9xl--line-height));\n }\n}\n.lg\\:text-sm {\n @media (width >= 64rem) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:max-h-none {\n & .edit-panel-container {\n max-height: none;\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:overflow-visible {\n & .edit-panel-container {\n overflow: visible;\n }\n}\n:root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji';\n --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --color-red-50: oklch(97.1% 0.013 17.38);\n --color-red-100: oklch(93.6% 0.032 17.717);\n --color-red-200: oklch(88.5% 0.062 18.334);\n --color-red-300: oklch(80.8% 0.114 19.571);\n --color-red-400: oklch(70.4% 0.191 22.216);\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-red-600: oklch(57.7% 0.245 27.325);\n --color-red-700: oklch(50.5% 0.213 27.518);\n --color-red-800: oklch(44.4% 0.177 26.899);\n --color-red-900: oklch(39.6% 0.141 25.723);\n --color-red-950: oklch(25.8% 0.092 26.042);\n --color-orange-50: oklch(98% 0.016 73.684);\n --color-orange-100: oklch(95.4% 0.038 75.164);\n --color-orange-200: oklch(90.1% 0.076 70.697);\n --color-orange-300: oklch(83.7% 0.128 66.29);\n --color-orange-400: oklch(75% 0.183 55.934);\n --color-orange-500: oklch(70.5% 0.213 47.604);\n --color-orange-600: oklch(64.6% 0.222 41.116);\n --color-orange-700: oklch(55.3% 0.195 38.402);\n --color-orange-800: oklch(47% 0.157 37.304);\n --color-orange-900: oklch(40.8% 0.123 38.172);\n --color-orange-950: oklch(26.6% 0.079 36.259);\n --color-amber-50: oklch(98.7% 0.022 95.277);\n --color-amber-100: oklch(96.2% 0.059 95.617);\n --color-amber-200: oklch(92.4% 0.12 95.746);\n --color-amber-300: oklch(87.9% 0.169 91.605);\n --color-amber-400: oklch(82.8% 0.189 84.429);\n --color-amber-500: oklch(76.9% 0.188 70.08);\n --color-amber-600: oklch(66.6% 0.179 58.318);\n --color-amber-700: oklch(55.5% 0.163 48.998);\n --color-amber-800: oklch(47.3% 0.137 46.201);\n --color-amber-900: oklch(41.4% 0.112 45.904);\n --color-amber-950: oklch(27.9% 0.077 45.635);\n --color-yellow-50: oklch(98.7% 0.026 102.212);\n --color-yellow-100: oklch(97.3% 0.071 103.193);\n --color-yellow-200: oklch(94.5% 0.129 101.54);\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-400: oklch(85.2% 0.199 91.936);\n --color-yellow-500: oklch(79.5% 0.184 86.047);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-yellow-700: oklch(55.4% 0.135 66.442);\n --color-yellow-800: oklch(47.6% 0.114 61.907);\n --color-yellow-900: oklch(42.1% 0.095 57.708);\n --color-yellow-950: oklch(28.6% 0.066 53.813);\n --color-lime-50: oklch(98.6% 0.031 120.757);\n --color-lime-100: oklch(96.7% 0.067 122.328);\n --color-lime-200: oklch(93.8% 0.127 124.321);\n --color-lime-300: oklch(89.7% 0.196 126.665);\n --color-lime-400: oklch(84.1% 0.238 128.85);\n --color-lime-500: oklch(76.8% 0.233 130.85);\n --color-lime-600: oklch(64.8% 0.2 131.684);\n --color-lime-700: oklch(53.2% 0.157 131.589);\n --color-lime-800: oklch(45.3% 0.124 130.933);\n --color-lime-900: oklch(40.5% 0.101 131.063);\n --color-lime-950: oklch(27.4% 0.072 132.109);\n --color-green-50: oklch(98.2% 0.018 155.826);\n --color-green-100: oklch(96.2% 0.044 156.743);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-300: oklch(87.1% 0.15 154.449);\n --color-green-400: oklch(79.2% 0.209 151.711);\n --color-green-500: oklch(72.3% 0.219 149.579);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-green-700: oklch(52.7% 0.154 150.069);\n --color-green-800: oklch(44.8% 0.119 151.328);\n --color-green-900: oklch(39.3% 0.095 152.535);\n --color-green-950: oklch(26.6% 0.065 152.934);\n --color-emerald-50: oklch(97.9% 0.021 166.113);\n --color-emerald-100: oklch(95% 0.052 163.051);\n --color-emerald-200: oklch(90.5% 0.093 164.15);\n --color-emerald-300: oklch(84.5% 0.143 164.978);\n --color-emerald-400: oklch(76.5% 0.177 163.223);\n --color-emerald-500: oklch(69.6% 0.17 162.48);\n --color-emerald-600: oklch(59.6% 0.145 163.225);\n --color-emerald-700: oklch(50.8% 0.118 165.612);\n --color-emerald-800: oklch(43.2% 0.095 166.913);\n --color-emerald-900: oklch(37.8% 0.077 168.94);\n --color-emerald-950: oklch(26.2% 0.051 172.552);\n --color-teal-50: oklch(98.4% 0.014 180.72);\n --color-teal-100: oklch(95.3% 0.051 180.801);\n --color-teal-200: oklch(91% 0.096 180.426);\n --color-teal-300: oklch(85.5% 0.138 181.071);\n --color-teal-400: oklch(77.7% 0.152 181.912);\n --color-teal-500: oklch(70.4% 0.14 182.503);\n --color-teal-600: oklch(60% 0.118 184.704);\n --color-teal-700: oklch(51.1% 0.096 186.391);\n --color-teal-800: oklch(43.7% 0.078 188.216);\n --color-teal-900: oklch(38.6% 0.063 188.416);\n --color-teal-950: oklch(27.7% 0.046 192.524);\n --color-cyan-50: oklch(98.4% 0.019 200.873);\n --color-cyan-100: oklch(95.6% 0.045 203.388);\n --color-cyan-200: oklch(91.7% 0.08 205.041);\n --color-cyan-300: oklch(86.5% 0.127 207.078);\n --color-cyan-400: oklch(78.9% 0.154 211.53);\n --color-cyan-500: oklch(71.5% 0.143 215.221);\n --color-cyan-600: oklch(60.9% 0.126 221.723);\n --color-cyan-700: oklch(52% 0.105 223.128);\n --color-cyan-800: oklch(45% 0.085 224.283);\n --color-cyan-900: oklch(39.8% 0.07 227.392);\n --color-cyan-950: oklch(30.2% 0.056 229.695);\n --color-sky-50: oklch(97.7% 0.013 236.62);\n --color-sky-100: oklch(95.1% 0.026 236.824);\n --color-sky-200: oklch(90.1% 0.058 230.902);\n --color-sky-300: oklch(82.8% 0.111 230.318);\n --color-sky-400: oklch(74.6% 0.16 232.661);\n --color-sky-500: oklch(68.5% 0.169 237.323);\n --color-sky-600: oklch(58.8% 0.158 241.966);\n --color-sky-700: oklch(50% 0.134 242.749);\n --color-sky-800: oklch(44.3% 0.11 240.79);\n --color-sky-900: oklch(39.1% 0.09 240.876);\n --color-sky-950: oklch(29.3% 0.066 243.157);\n --color-blue-50: oklch(97% 0.014 254.604);\n --color-blue-100: oklch(93.2% 0.032 255.585);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-300: oklch(80.9% 0.105 251.813);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-blue-500: oklch(62.3% 0.214 259.815);\n --color-blue-600: oklch(54.6% 0.245 262.881);\n --color-blue-700: oklch(48.8% 0.243 264.376);\n --color-blue-800: oklch(42.4% 0.199 265.638);\n --color-blue-900: oklch(37.9% 0.146 265.522);\n --color-blue-950: oklch(28.2% 0.091 267.935);\n --color-indigo-50: oklch(96.2% 0.018 272.314);\n --color-indigo-100: oklch(93% 0.034 272.788);\n --color-indigo-200: oklch(87% 0.065 274.039);\n --color-indigo-300: oklch(78.5% 0.115 274.713);\n --color-indigo-400: oklch(67.3% 0.182 276.935);\n --color-indigo-500: oklch(58.5% 0.233 277.117);\n --color-indigo-600: oklch(51.1% 0.262 276.966);\n --color-indigo-700: oklch(45.7% 0.24 277.023);\n --color-indigo-800: oklch(39.8% 0.195 277.366);\n --color-indigo-900: oklch(35.9% 0.144 278.697);\n --color-indigo-950: oklch(25.7% 0.09 281.288);\n --color-violet-50: oklch(96.9% 0.016 293.756);\n --color-violet-100: oklch(94.3% 0.029 294.588);\n --color-violet-200: oklch(89.4% 0.057 293.283);\n --color-violet-300: oklch(81.1% 0.111 293.571);\n --color-violet-400: oklch(70.2% 0.183 293.541);\n --color-violet-500: oklch(60.6% 0.25 292.717);\n --color-violet-600: oklch(54.1% 0.281 293.009);\n --color-violet-700: oklch(49.1% 0.27 292.581);\n --color-violet-800: oklch(43.2% 0.232 292.759);\n --color-violet-900: oklch(38% 0.189 293.745);\n --color-violet-950: oklch(28.3% 0.141 291.089);\n --color-purple-50: oklch(97.7% 0.014 308.299);\n --color-purple-100: oklch(94.6% 0.033 307.174);\n --color-purple-200: oklch(90.2% 0.063 306.703);\n --color-purple-300: oklch(82.7% 0.119 306.383);\n --color-purple-400: oklch(71.4% 0.203 305.504);\n --color-purple-500: oklch(62.7% 0.265 303.9);\n --color-purple-600: oklch(55.8% 0.288 302.321);\n --color-purple-700: oklch(49.6% 0.265 301.924);\n --color-purple-800: oklch(43.8% 0.218 303.724);\n --color-purple-900: oklch(38.1% 0.176 304.987);\n --color-purple-950: oklch(29.1% 0.149 302.717);\n --color-fuchsia-50: oklch(97.7% 0.017 320.058);\n --color-fuchsia-100: oklch(95.2% 0.037 318.852);\n --color-fuchsia-200: oklch(90.3% 0.076 319.62);\n --color-fuchsia-300: oklch(83.3% 0.145 321.434);\n --color-fuchsia-400: oklch(74% 0.238 322.16);\n --color-fuchsia-500: oklch(66.7% 0.295 322.15);\n --color-fuchsia-600: oklch(59.1% 0.293 322.896);\n --color-fuchsia-700: oklch(51.8% 0.253 323.949);\n --color-fuchsia-800: oklch(45.2% 0.211 324.591);\n --color-fuchsia-900: oklch(40.1% 0.17 325.612);\n --color-fuchsia-950: oklch(29.3% 0.136 325.661);\n --color-pink-50: oklch(97.1% 0.014 343.198);\n --color-pink-100: oklch(94.8% 0.028 342.258);\n --color-pink-200: oklch(89.9% 0.061 343.231);\n --color-pink-300: oklch(82.3% 0.12 346.018);\n --color-pink-400: oklch(71.8% 0.202 349.761);\n --color-pink-500: oklch(65.6% 0.241 354.308);\n --color-pink-600: oklch(59.2% 0.249 0.584);\n --color-pink-700: oklch(52.5% 0.223 3.958);\n --color-pink-800: oklch(45.9% 0.187 3.815);\n --color-pink-900: oklch(40.8% 0.153 2.432);\n --color-pink-950: oklch(28.4% 0.109 3.907);\n --color-rose-50: oklch(96.9% 0.015 12.422);\n --color-rose-100: oklch(94.1% 0.03 12.58);\n --color-rose-200: oklch(89.2% 0.058 10.001);\n --color-rose-300: oklch(81% 0.117 11.638);\n --color-rose-400: oklch(71.2% 0.194 13.428);\n --color-rose-500: oklch(64.5% 0.246 16.439);\n --color-rose-600: oklch(58.6% 0.253 17.585);\n --color-rose-700: oklch(51.4% 0.222 16.935);\n --color-rose-800: oklch(45.5% 0.188 13.697);\n --color-rose-900: oklch(41% 0.159 10.272);\n --color-rose-950: oklch(27.1% 0.105 12.094);\n --color-slate-50: oklch(98.4% 0.003 247.858);\n --color-slate-100: oklch(96.8% 0.007 247.896);\n --color-slate-200: oklch(92.9% 0.013 255.508);\n --color-slate-300: oklch(86.9% 0.022 252.894);\n --color-slate-400: oklch(70.4% 0.04 256.788);\n --color-slate-500: oklch(55.4% 0.046 257.417);\n --color-slate-600: oklch(44.6% 0.043 257.281);\n --color-slate-700: oklch(37.2% 0.044 257.287);\n --color-slate-800: oklch(27.9% 0.041 260.031);\n --color-slate-900: oklch(20.8% 0.042 265.755);\n --color-slate-950: oklch(12.9% 0.042 264.695);\n --color-gray-50: oklch(98.5% 0.002 247.839);\n --color-gray-100: oklch(96.7% 0.003 264.542);\n --color-gray-200: oklch(92.8% 0.006 264.531);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-500: oklch(55.1% 0.027 264.364);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-gray-700: oklch(37.3% 0.034 259.733);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-gray-900: oklch(21% 0.034 264.665);\n --color-gray-950: oklch(13% 0.028 261.692);\n --color-zinc-50: oklch(98.5% 0 0);\n --color-zinc-100: oklch(96.7% 0.001 286.375);\n --color-zinc-200: oklch(92% 0.004 286.32);\n --color-zinc-300: oklch(87.1% 0.006 286.286);\n --color-zinc-400: oklch(70.5% 0.015 286.067);\n --color-zinc-500: oklch(55.2% 0.016 285.938);\n --color-zinc-600: oklch(44.2% 0.017 285.786);\n --color-zinc-700: oklch(37% 0.013 285.805);\n --color-zinc-800: oklch(27.4% 0.006 286.033);\n --color-zinc-900: oklch(21% 0.006 285.885);\n --color-zinc-950: oklch(14.1% 0.005 285.823);\n --color-neutral-50: oklch(98.5% 0 0);\n --color-neutral-100: oklch(97% 0 0);\n --color-neutral-200: oklch(92.2% 0 0);\n --color-neutral-300: oklch(87% 0 0);\n --color-neutral-400: oklch(70.8% 0 0);\n --color-neutral-500: oklch(55.6% 0 0);\n --color-neutral-600: oklch(43.9% 0 0);\n --color-neutral-700: oklch(37.1% 0 0);\n --color-neutral-800: oklch(26.9% 0 0);\n --color-neutral-900: oklch(20.5% 0 0);\n --color-neutral-950: oklch(14.5% 0 0);\n --color-stone-50: oklch(98.5% 0.001 106.423);\n --color-stone-100: oklch(97% 0.001 106.424);\n --color-stone-200: oklch(92.3% 0.003 48.717);\n --color-stone-300: oklch(86.9% 0.005 56.366);\n --color-stone-400: oklch(70.9% 0.01 56.259);\n --color-stone-500: oklch(55.3% 0.013 58.071);\n --color-stone-600: oklch(44.4% 0.011 73.639);\n --color-stone-700: oklch(37.4% 0.01 67.558);\n --color-stone-800: oklch(26.8% 0.007 34.298);\n --color-stone-900: oklch(21.6% 0.006 56.043);\n --color-stone-950: oklch(14.7% 0.004 49.25);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n --container-3xs: 16rem;\n --container-2xs: 18rem;\n --container-xs: 20rem;\n --container-sm: 24rem;\n --container-md: 28rem;\n --container-lg: 32rem;\n --container-xl: 36rem;\n --container-2xl: 42rem;\n --container-3xl: 48rem;\n --container-4xl: 56rem;\n --container-5xl: 64rem;\n --container-6xl: 72rem;\n --container-7xl: 80rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --text-3xl: 1.875rem;\n --text-3xl--line-height: calc(2.25 / 1.875);\n --text-4xl: 2.25rem;\n --text-4xl--line-height: calc(2.5 / 2.25);\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 6rem;\n --text-8xl--line-height: 1;\n --text-9xl: 8rem;\n --text-9xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-extralight: 200;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-extrabold: 800;\n --font-weight-black: 900;\n --tracking-tighter: -0.05em;\n --tracking-tight: -0.025em;\n --tracking-normal: 0em;\n --tracking-wide: 0.025em;\n --tracking-wider: 0.05em;\n --tracking-widest: 0.1em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-normal: 1.5;\n --leading-relaxed: 1.625;\n --leading-loose: 2;\n --radius-xs: 0.125rem;\n --radius-sm: 0.25rem;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --radius-xl: 0.75rem;\n --radius-2xl: 1rem;\n --radius-3xl: 1.5rem;\n --radius-4xl: 2rem;\n --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);\n --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);\n --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);\n --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);\n --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);\n --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);\n --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);\n --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);\n --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);\n --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);\n --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);\n --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);\n --text-shadow-sm: 0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);\n --text-shadow-md: 0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);\n --text-shadow-lg: 0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;\n --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --animate-bounce: bounce 1s infinite;\n --blur-xs: 4px;\n --blur-sm: 8px;\n --blur-md: 12px;\n --blur-lg: 16px;\n --blur-xl: 24px;\n --blur-2xl: 40px;\n --blur-3xl: 64px;\n --perspective-dramatic: 100px;\n --perspective-near: 300px;\n --perspective-normal: 500px;\n --perspective-midrange: 800px;\n --perspective-distant: 1200px;\n --aspect-video: 16 / 9;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji';\n --default-font-feature-settings: initial;\n --default-font-variation-settings: initial;\n --default-mono-font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --default-mono-font-feature-settings: initial;\n --default-mono-font-variation-settings: initial;\n --font-titillium: \"Titillium Web\", sans-serif;\n}\ndiv:focus-visible, button:focus-visible {\n outline: none;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root {\n color-scheme: dark;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-white {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-50 {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-100 {\n background-color: #363c42 !important;\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateX(0);\n}\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateY(0);\n}\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateZ(0);\n}\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false;\n initial-value: skewX(0);\n}\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false;\n initial-value: skewY(0);\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes ping {\n 75%, 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes bounce {\n 0%, 100% {\n transform: translateY(-25%);\n animation-timing-function: cubic-bezier(0.8, 0, 1, 1);\n }\n 50% {\n transform: none;\n animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n }\n}\n";
|
|
9
9
|
document.head.appendChild(style);
|
|
10
10
|
}
|
|
11
11
|
window.__QUESTIONNAIRE_EDITOR_CSS_INJECTED = true;
|
|
12
12
|
})();
|
|
13
|
-
import m, { useCallback as Te, useMemo as Ye, memo as Be, useState as ke, useRef as K, useEffect as
|
|
14
|
-
import { useFormStore as re, useFormData as Ct, useUIApi as
|
|
13
|
+
import m, { useCallback as Te, useMemo as Ye, memo as Be, useState as ke, useRef as K, useEffect as ae } from "react";
|
|
14
|
+
import { useFormStore as re, useFormData as Ct, useUIApi as oe, VEDITOR_ICON as cr, CODE_ICON as dr, PICTURE_ICON as ur, UPLOAD_ICON as fr, DOWNLOAD_ICON as mr, parseAndDetect as Et, adaptSchema as Nt, fieldTypes as de, TOOLS_ICON as hr, X_ICON as pr, PAPERCLIP_ICON as gr, MATRIX_ICON as br, RANKING_ICON as vr, SELECTINPUT_ICON as xr, FOLDERS_ICON as yr, TEXTINPUT_ICON as jr, TRASHCANTWO_ICON as ye, useFormApi as Je, FormStoreContext as He, ARROWDOWN_ICON as wr, NUMERIC_EXPRESSION_FORMATS as Cr, EDIT_ICON as Er, EYEEDIT_ICON as Nr, useVisibleFields as Or, useUIStore as Ir, getFieldComponent as Sr, createFormStore as Rr, createUIStore as Tr, UIStoreContext as kr } from "@mieweb/forms-engine";
|
|
15
15
|
import pe from "js-yaml";
|
|
16
|
-
|
|
16
|
+
import { useStore as Pr } from "zustand";
|
|
17
|
+
var Ie = { exports: {} }, ge = {};
|
|
17
18
|
/**
|
|
18
19
|
* @license React
|
|
19
20
|
* react-jsx-runtime.production.min.js
|
|
@@ -24,16 +25,16 @@ var Se = { exports: {} }, ge = {};
|
|
|
24
25
|
* LICENSE file in the root directory of this source tree.
|
|
25
26
|
*/
|
|
26
27
|
var dt;
|
|
27
|
-
function
|
|
28
|
+
function _r() {
|
|
28
29
|
if (dt) return ge;
|
|
29
30
|
dt = 1;
|
|
30
|
-
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.fragment"),
|
|
31
|
+
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.fragment"), a = Object.prototype.hasOwnProperty, o = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
|
|
31
32
|
function c(f, u, h) {
|
|
32
|
-
var
|
|
33
|
+
var x, i = {}, A = null, T = null;
|
|
33
34
|
h !== void 0 && (A = "" + h), u.key !== void 0 && (A = "" + u.key), u.ref !== void 0 && (T = u.ref);
|
|
34
|
-
for (
|
|
35
|
-
if (f && f.defaultProps) for (
|
|
36
|
-
return { $$typeof: r, type: f, key: A, ref: T, props: i, _owner:
|
|
35
|
+
for (x in u) a.call(u, x) && !l.hasOwnProperty(x) && (i[x] = u[x]);
|
|
36
|
+
if (f && f.defaultProps) for (x in u = f.defaultProps, u) i[x] === void 0 && (i[x] = u[x]);
|
|
37
|
+
return { $$typeof: r, type: f, key: A, ref: T, props: i, _owner: o.current };
|
|
37
38
|
}
|
|
38
39
|
return ge.Fragment = s, ge.jsx = c, ge.jsxs = c, ge;
|
|
39
40
|
}
|
|
@@ -48,16 +49,16 @@ var be = {};
|
|
|
48
49
|
* LICENSE file in the root directory of this source tree.
|
|
49
50
|
*/
|
|
50
51
|
var ut;
|
|
51
|
-
function
|
|
52
|
+
function Ar() {
|
|
52
53
|
return ut || (ut = 1, process.env.NODE_ENV !== "production" && (function() {
|
|
53
|
-
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.portal"),
|
|
54
|
+
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.portal"), a = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), c = Symbol.for("react.provider"), f = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), h = Symbol.for("react.suspense"), x = Symbol.for("react.suspense_list"), i = Symbol.for("react.memo"), A = Symbol.for("react.lazy"), T = Symbol.for("react.offscreen"), W = Symbol.iterator, j = "@@iterator";
|
|
54
55
|
function E(n) {
|
|
55
56
|
if (n === null || typeof n != "object")
|
|
56
57
|
return null;
|
|
57
|
-
var d =
|
|
58
|
+
var d = W && n[W] || n[j];
|
|
58
59
|
return typeof d == "function" ? d : null;
|
|
59
60
|
}
|
|
60
|
-
var
|
|
61
|
+
var I = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
61
62
|
function y(n) {
|
|
62
63
|
{
|
|
63
64
|
for (var d = arguments.length, b = new Array(d > 1 ? d - 1 : 0), C = 1; C < d; C++)
|
|
@@ -67,18 +68,18 @@ function Pr() {
|
|
|
67
68
|
}
|
|
68
69
|
function S(n, d, b) {
|
|
69
70
|
{
|
|
70
|
-
var C =
|
|
71
|
-
|
|
71
|
+
var C = I.ReactDebugCurrentFrame, F = C.getStackAddendum();
|
|
72
|
+
F !== "" && (d += "%s", b = b.concat([F]));
|
|
72
73
|
var $ = b.map(function(_) {
|
|
73
74
|
return String(_);
|
|
74
75
|
});
|
|
75
76
|
$.unshift("Warning: " + d), Function.prototype.apply.call(console[n], console, $);
|
|
76
77
|
}
|
|
77
78
|
}
|
|
78
|
-
var p = !1, N = !1, L = !1,
|
|
79
|
+
var p = !1, N = !1, L = !1, q = !1, B = !1, U;
|
|
79
80
|
U = Symbol.for("react.module.reference");
|
|
80
81
|
function k(n) {
|
|
81
|
-
return !!(typeof n == "string" || typeof n == "function" || n ===
|
|
82
|
+
return !!(typeof n == "string" || typeof n == "function" || n === a || n === l || B || n === o || n === h || n === x || q || n === T || p || N || L || typeof n == "object" && n !== null && (n.$$typeof === A || n.$$typeof === i || n.$$typeof === c || n.$$typeof === f || n.$$typeof === u || // This needs to include all possible module reference object
|
|
82
83
|
// types supported by any Flight configuration anywhere since
|
|
83
84
|
// we don't know which Flight build this will end up being used
|
|
84
85
|
// with.
|
|
@@ -88,8 +89,8 @@ function Pr() {
|
|
|
88
89
|
var C = n.displayName;
|
|
89
90
|
if (C)
|
|
90
91
|
return C;
|
|
91
|
-
var
|
|
92
|
-
return
|
|
92
|
+
var F = d.displayName || d.name || "";
|
|
93
|
+
return F !== "" ? b + "(" + F + ")" : b;
|
|
93
94
|
}
|
|
94
95
|
function ne(n) {
|
|
95
96
|
return n.displayName || "Context";
|
|
@@ -102,17 +103,17 @@ function Pr() {
|
|
|
102
103
|
if (typeof n == "string")
|
|
103
104
|
return n;
|
|
104
105
|
switch (n) {
|
|
105
|
-
case
|
|
106
|
+
case a:
|
|
106
107
|
return "Fragment";
|
|
107
108
|
case s:
|
|
108
109
|
return "Portal";
|
|
109
110
|
case l:
|
|
110
111
|
return "Profiler";
|
|
111
|
-
case
|
|
112
|
+
case o:
|
|
112
113
|
return "StrictMode";
|
|
113
114
|
case h:
|
|
114
115
|
return "Suspense";
|
|
115
|
-
case
|
|
116
|
+
case x:
|
|
116
117
|
return "SuspenseList";
|
|
117
118
|
}
|
|
118
119
|
if (typeof n == "object")
|
|
@@ -129,7 +130,7 @@ function Pr() {
|
|
|
129
130
|
var C = n.displayName || null;
|
|
130
131
|
return C !== null ? C : G(n.type) || "Memo";
|
|
131
132
|
case A: {
|
|
132
|
-
var
|
|
133
|
+
var F = n, $ = F._payload, _ = F._init;
|
|
133
134
|
try {
|
|
134
135
|
return G(_($));
|
|
135
136
|
} catch {
|
|
@@ -139,14 +140,14 @@ function Pr() {
|
|
|
139
140
|
}
|
|
140
141
|
return null;
|
|
141
142
|
}
|
|
142
|
-
var
|
|
143
|
+
var v = Object.assign, g = 0, w, V, M, J, O, R, D;
|
|
143
144
|
function H() {
|
|
144
145
|
}
|
|
145
146
|
H.__reactDisabledLog = !0;
|
|
146
147
|
function se() {
|
|
147
148
|
{
|
|
148
149
|
if (g === 0) {
|
|
149
|
-
w = console.log,
|
|
150
|
+
w = console.log, V = console.info, M = console.warn, J = console.error, O = console.group, R = console.groupCollapsed, D = console.groupEnd;
|
|
150
151
|
var n = {
|
|
151
152
|
configurable: !0,
|
|
152
153
|
enumerable: !0,
|
|
@@ -175,25 +176,25 @@ function Pr() {
|
|
|
175
176
|
writable: !0
|
|
176
177
|
};
|
|
177
178
|
Object.defineProperties(console, {
|
|
178
|
-
log:
|
|
179
|
+
log: v({}, n, {
|
|
179
180
|
value: w
|
|
180
181
|
}),
|
|
181
|
-
info:
|
|
182
|
-
value:
|
|
182
|
+
info: v({}, n, {
|
|
183
|
+
value: V
|
|
183
184
|
}),
|
|
184
|
-
warn:
|
|
185
|
-
value:
|
|
185
|
+
warn: v({}, n, {
|
|
186
|
+
value: M
|
|
186
187
|
}),
|
|
187
|
-
error:
|
|
188
|
+
error: v({}, n, {
|
|
188
189
|
value: J
|
|
189
190
|
}),
|
|
190
|
-
group:
|
|
191
|
-
value:
|
|
191
|
+
group: v({}, n, {
|
|
192
|
+
value: O
|
|
192
193
|
}),
|
|
193
|
-
groupCollapsed:
|
|
194
|
+
groupCollapsed: v({}, n, {
|
|
194
195
|
value: R
|
|
195
196
|
}),
|
|
196
|
-
groupEnd:
|
|
197
|
+
groupEnd: v({}, n, {
|
|
197
198
|
value: D
|
|
198
199
|
})
|
|
199
200
|
});
|
|
@@ -201,14 +202,14 @@ function Pr() {
|
|
|
201
202
|
g < 0 && y("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
|
|
202
203
|
}
|
|
203
204
|
}
|
|
204
|
-
var Ae =
|
|
205
|
+
var Ae = I.ReactCurrentDispatcher, Me;
|
|
205
206
|
function Ce(n, d, b) {
|
|
206
207
|
{
|
|
207
208
|
if (Me === void 0)
|
|
208
209
|
try {
|
|
209
210
|
throw Error();
|
|
210
|
-
} catch (
|
|
211
|
-
var C =
|
|
211
|
+
} catch (F) {
|
|
212
|
+
var C = F.stack.trim().match(/\n( *(at )?)/);
|
|
212
213
|
Me = C && C[1] || "";
|
|
213
214
|
}
|
|
214
215
|
return `
|
|
@@ -230,7 +231,7 @@ function Pr() {
|
|
|
230
231
|
}
|
|
231
232
|
var C;
|
|
232
233
|
Fe = !0;
|
|
233
|
-
var
|
|
234
|
+
var F = Error.prepareStackTrace;
|
|
234
235
|
Error.prepareStackTrace = void 0;
|
|
235
236
|
var $;
|
|
236
237
|
$ = Ae.current, Ae.current = null, se();
|
|
@@ -286,7 +287,7 @@ function Pr() {
|
|
|
286
287
|
}
|
|
287
288
|
}
|
|
288
289
|
} finally {
|
|
289
|
-
Fe = !1, Ae.current = $, ie(), Error.prepareStackTrace =
|
|
290
|
+
Fe = !1, Ae.current = $, ie(), Error.prepareStackTrace = F;
|
|
290
291
|
}
|
|
291
292
|
var fe = n ? n.displayName || n.name : "", ce = fe ? Ce(fe) : "";
|
|
292
293
|
return typeof n == "function" && Ee.set(n, ce), ce;
|
|
@@ -294,7 +295,7 @@ function Pr() {
|
|
|
294
295
|
function $t(n, d, b) {
|
|
295
296
|
return Ke(n, !1);
|
|
296
297
|
}
|
|
297
|
-
function
|
|
298
|
+
function qt(n) {
|
|
298
299
|
var d = n.prototype;
|
|
299
300
|
return !!(d && d.isReactComponent);
|
|
300
301
|
}
|
|
@@ -302,13 +303,13 @@ function Pr() {
|
|
|
302
303
|
if (n == null)
|
|
303
304
|
return "";
|
|
304
305
|
if (typeof n == "function")
|
|
305
|
-
return Ke(n,
|
|
306
|
+
return Ke(n, qt(n));
|
|
306
307
|
if (typeof n == "string")
|
|
307
308
|
return Ce(n);
|
|
308
309
|
switch (n) {
|
|
309
310
|
case h:
|
|
310
311
|
return Ce("Suspense");
|
|
311
|
-
case
|
|
312
|
+
case x:
|
|
312
313
|
return Ce("SuspenseList");
|
|
313
314
|
}
|
|
314
315
|
if (typeof n == "object")
|
|
@@ -318,16 +319,16 @@ function Pr() {
|
|
|
318
319
|
case i:
|
|
319
320
|
return Ne(n.type, d, b);
|
|
320
321
|
case A: {
|
|
321
|
-
var C = n,
|
|
322
|
+
var C = n, F = C._payload, $ = C._init;
|
|
322
323
|
try {
|
|
323
|
-
return Ne($(
|
|
324
|
+
return Ne($(F), d, b);
|
|
324
325
|
} catch {
|
|
325
326
|
}
|
|
326
327
|
}
|
|
327
328
|
}
|
|
328
329
|
return "";
|
|
329
330
|
}
|
|
330
|
-
var he = Object.prototype.hasOwnProperty, Ge = {}, Xe =
|
|
331
|
+
var he = Object.prototype.hasOwnProperty, Ge = {}, Xe = I.ReactDebugCurrentFrame;
|
|
331
332
|
function Oe(n) {
|
|
332
333
|
if (n) {
|
|
333
334
|
var d = n._owner, b = Ne(n.type, n._source, d ? d.type : null);
|
|
@@ -335,7 +336,7 @@ function Pr() {
|
|
|
335
336
|
} else
|
|
336
337
|
Xe.setExtraStackFrame(null);
|
|
337
338
|
}
|
|
338
|
-
function
|
|
339
|
+
function Wt(n, d, b, C, F) {
|
|
339
340
|
{
|
|
340
341
|
var $ = Function.call.bind(he);
|
|
341
342
|
for (var _ in n)
|
|
@@ -350,7 +351,7 @@ function Pr() {
|
|
|
350
351
|
} catch (z) {
|
|
351
352
|
P = z;
|
|
352
353
|
}
|
|
353
|
-
P && !(P instanceof Error) && (Oe(
|
|
354
|
+
P && !(P instanceof Error) && (Oe(F), y("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", C || "React class", b, _, typeof P), Oe(null)), P instanceof Error && !(P.message in Ge) && (Ge[P.message] = !0, Oe(F), y("Failed %s type: %s", b, P.message), Oe(null));
|
|
354
355
|
}
|
|
355
356
|
}
|
|
356
357
|
}
|
|
@@ -358,7 +359,7 @@ function Pr() {
|
|
|
358
359
|
function De(n) {
|
|
359
360
|
return Ut(n);
|
|
360
361
|
}
|
|
361
|
-
function
|
|
362
|
+
function Vt(n) {
|
|
362
363
|
{
|
|
363
364
|
var d = typeof Symbol == "function" && Symbol.toStringTag, b = d && n[Symbol.toStringTag] || n.constructor.name || "Object";
|
|
364
365
|
return b;
|
|
@@ -376,9 +377,9 @@ function Pr() {
|
|
|
376
377
|
}
|
|
377
378
|
function Ze(n) {
|
|
378
379
|
if (zt(n))
|
|
379
|
-
return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",
|
|
380
|
+
return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Vt(n)), Qe(n);
|
|
380
381
|
}
|
|
381
|
-
var et =
|
|
382
|
+
var et = I.ReactCurrentOwner, Yt = {
|
|
382
383
|
key: !0,
|
|
383
384
|
ref: !0,
|
|
384
385
|
__self: !0,
|
|
@@ -425,7 +426,7 @@ function Pr() {
|
|
|
425
426
|
});
|
|
426
427
|
}
|
|
427
428
|
}
|
|
428
|
-
var Xt = function(n, d, b, C,
|
|
429
|
+
var Xt = function(n, d, b, C, F, $, _) {
|
|
429
430
|
var P = {
|
|
430
431
|
// This tag allows us to uniquely identify this as a React Element
|
|
431
432
|
$$typeof: r,
|
|
@@ -451,13 +452,13 @@ function Pr() {
|
|
|
451
452
|
configurable: !1,
|
|
452
453
|
enumerable: !1,
|
|
453
454
|
writable: !1,
|
|
454
|
-
value:
|
|
455
|
+
value: F
|
|
455
456
|
}), Object.freeze && (Object.freeze(P.props), Object.freeze(P)), P;
|
|
456
457
|
};
|
|
457
|
-
function Qt(n, d, b, C,
|
|
458
|
+
function Qt(n, d, b, C, F) {
|
|
458
459
|
{
|
|
459
460
|
var $, _ = {}, P = null, X = null;
|
|
460
|
-
b !== void 0 && (Ze(b), P = "" + b), Bt(d) && (Ze(d.key), P = "" + d.key), Jt(d) && (X = d.ref, Ht(d,
|
|
461
|
+
b !== void 0 && (Ze(b), P = "" + b), Bt(d) && (Ze(d.key), P = "" + d.key), Jt(d) && (X = d.ref, Ht(d, F));
|
|
461
462
|
for ($ in d)
|
|
462
463
|
he.call(d, $) && !Yt.hasOwnProperty($) && (_[$] = d[$]);
|
|
463
464
|
if (n && n.defaultProps) {
|
|
@@ -469,10 +470,10 @@ function Pr() {
|
|
|
469
470
|
var Y = typeof n == "function" ? n.displayName || n.name || "Unknown" : n;
|
|
470
471
|
P && Kt(_, Y), X && Gt(_, Y);
|
|
471
472
|
}
|
|
472
|
-
return Xt(n, P, X,
|
|
473
|
+
return Xt(n, P, X, F, C, et.current, _);
|
|
473
474
|
}
|
|
474
475
|
}
|
|
475
|
-
var Le =
|
|
476
|
+
var Le = I.ReactCurrentOwner, nt = I.ReactDebugCurrentFrame;
|
|
476
477
|
function ue(n) {
|
|
477
478
|
if (n) {
|
|
478
479
|
var d = n._owner, b = Ne(n.type, n._source, d ? d.type : null);
|
|
@@ -482,7 +483,7 @@ function Pr() {
|
|
|
482
483
|
}
|
|
483
484
|
var $e;
|
|
484
485
|
$e = !1;
|
|
485
|
-
function
|
|
486
|
+
function qe(n) {
|
|
486
487
|
return typeof n == "object" && n !== null && n.$$typeof === r;
|
|
487
488
|
}
|
|
488
489
|
function st() {
|
|
@@ -500,7 +501,7 @@ Check the render method of \`` + n + "`.";
|
|
|
500
501
|
function Zt(n) {
|
|
501
502
|
return "";
|
|
502
503
|
}
|
|
503
|
-
var
|
|
504
|
+
var at = {};
|
|
504
505
|
function er(n) {
|
|
505
506
|
{
|
|
506
507
|
var d = st();
|
|
@@ -513,15 +514,15 @@ Check the top-level render call using <` + b + ">.");
|
|
|
513
514
|
return d;
|
|
514
515
|
}
|
|
515
516
|
}
|
|
516
|
-
function
|
|
517
|
+
function ot(n, d) {
|
|
517
518
|
{
|
|
518
519
|
if (!n._store || n._store.validated || n.key != null)
|
|
519
520
|
return;
|
|
520
521
|
n._store.validated = !0;
|
|
521
522
|
var b = er(d);
|
|
522
|
-
if (
|
|
523
|
+
if (at[b])
|
|
523
524
|
return;
|
|
524
|
-
|
|
525
|
+
at[b] = !0;
|
|
525
526
|
var C = "";
|
|
526
527
|
n && n._owner && n._owner !== Le.current && (C = " It was passed a child from " + G(n._owner.type) + "."), ue(n), y('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', b, C), ue(null);
|
|
527
528
|
}
|
|
@@ -533,15 +534,15 @@ Check the top-level render call using <` + b + ">.");
|
|
|
533
534
|
if (De(n))
|
|
534
535
|
for (var b = 0; b < n.length; b++) {
|
|
535
536
|
var C = n[b];
|
|
536
|
-
|
|
537
|
+
qe(C) && ot(C, d);
|
|
537
538
|
}
|
|
538
|
-
else if (
|
|
539
|
+
else if (qe(n))
|
|
539
540
|
n._store && (n._store.validated = !0);
|
|
540
541
|
else if (n) {
|
|
541
|
-
var
|
|
542
|
-
if (typeof
|
|
543
|
-
for (var $ =
|
|
544
|
-
|
|
542
|
+
var F = E(n);
|
|
543
|
+
if (typeof F == "function" && F !== n.entries)
|
|
544
|
+
for (var $ = F.call(n), _; !(_ = $.next()).done; )
|
|
545
|
+
qe(_.value) && ot(_.value, d);
|
|
545
546
|
}
|
|
546
547
|
}
|
|
547
548
|
}
|
|
@@ -561,11 +562,11 @@ Check the top-level render call using <` + b + ">.");
|
|
|
561
562
|
return;
|
|
562
563
|
if (b) {
|
|
563
564
|
var C = G(d);
|
|
564
|
-
|
|
565
|
+
Wt(b, n.props, "prop", C, n);
|
|
565
566
|
} else if (d.PropTypes !== void 0 && !$e) {
|
|
566
567
|
$e = !0;
|
|
567
|
-
var
|
|
568
|
-
y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",
|
|
568
|
+
var F = G(d);
|
|
569
|
+
y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", F || "Unknown");
|
|
569
570
|
}
|
|
570
571
|
typeof d.getDefaultProps == "function" && !d.getDefaultProps.isReactClassApproved && y("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
|
|
571
572
|
}
|
|
@@ -583,7 +584,7 @@ Check the top-level render call using <` + b + ">.");
|
|
|
583
584
|
}
|
|
584
585
|
}
|
|
585
586
|
var lt = {};
|
|
586
|
-
function ct(n, d, b, C,
|
|
587
|
+
function ct(n, d, b, C, F, $) {
|
|
587
588
|
{
|
|
588
589
|
var _ = k(n);
|
|
589
590
|
if (!_) {
|
|
@@ -594,7 +595,7 @@ Check the top-level render call using <` + b + ">.");
|
|
|
594
595
|
var z;
|
|
595
596
|
n === null ? z = "null" : De(n) ? z = "array" : n !== void 0 && n.$$typeof === r ? (z = "<" + (G(n.type) || "Unknown") + " />", P = " Did you accidentally export a JSX literal instead of a component?") : z = typeof n, y("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", z, P);
|
|
596
597
|
}
|
|
597
|
-
var Y = Qt(n, d, b,
|
|
598
|
+
var Y = Qt(n, d, b, F, $);
|
|
598
599
|
if (Y == null)
|
|
599
600
|
return Y;
|
|
600
601
|
if (_) {
|
|
@@ -613,18 +614,18 @@ Check the top-level render call using <` + b + ">.");
|
|
|
613
614
|
if (he.call(d, "key")) {
|
|
614
615
|
var ce = G(n), Q = Object.keys(d).filter(function(lr) {
|
|
615
616
|
return lr !== "key";
|
|
616
|
-
}),
|
|
617
|
-
if (!lt[ce +
|
|
617
|
+
}), We = Q.length > 0 ? "{key: someKey, " + Q.join(": ..., ") + ": ...}" : "{key: someKey}";
|
|
618
|
+
if (!lt[ce + We]) {
|
|
618
619
|
var ir = Q.length > 0 ? "{" + Q.join(": ..., ") + ": ...}" : "{}";
|
|
619
620
|
y(`A props object containing a "key" prop is being spread into JSX:
|
|
620
621
|
let props = %s;
|
|
621
622
|
<%s {...props} />
|
|
622
623
|
React keys must be passed directly to JSX without using spread:
|
|
623
624
|
let props = %s;
|
|
624
|
-
<%s key={someKey} {...props} />`,
|
|
625
|
+
<%s key={someKey} {...props} />`, We, ce, ir, ce), lt[ce + We] = !0;
|
|
625
626
|
}
|
|
626
627
|
}
|
|
627
|
-
return n ===
|
|
628
|
+
return n === a ? rr(Y) : tr(Y), Y;
|
|
628
629
|
}
|
|
629
630
|
}
|
|
630
631
|
function nr(n, d, b) {
|
|
@@ -633,19 +634,19 @@ React keys must be passed directly to JSX without using spread:
|
|
|
633
634
|
function sr(n, d, b) {
|
|
634
635
|
return ct(n, d, b, !1);
|
|
635
636
|
}
|
|
636
|
-
var
|
|
637
|
-
be.Fragment =
|
|
637
|
+
var ar = sr, or = nr;
|
|
638
|
+
be.Fragment = a, be.jsx = ar, be.jsxs = or;
|
|
638
639
|
})()), be;
|
|
639
640
|
}
|
|
640
641
|
var ft;
|
|
641
|
-
function
|
|
642
|
-
return ft || (ft = 1, process.env.NODE_ENV === "production" ?
|
|
642
|
+
function Mr() {
|
|
643
|
+
return ft || (ft = 1, process.env.NODE_ENV === "production" ? Ie.exports = _r() : Ie.exports = Ar()), Ie.exports;
|
|
643
644
|
}
|
|
644
|
-
var t =
|
|
645
|
-
function
|
|
646
|
-
const [e, r] = m.useState(!1), [s,
|
|
645
|
+
var t = Mr();
|
|
646
|
+
function Fr() {
|
|
647
|
+
const [e, r] = m.useState(!1), [s, a] = m.useState(null), o = re((E) => E.replaceAll), l = Ct(), c = oe(), f = c.state.isPreview, u = c.state.isCodeEditor ?? !1, h = (E) => {
|
|
647
648
|
try {
|
|
648
|
-
const
|
|
649
|
+
const I = String(E).replace(/^\uFEFF/, "").trim(), { data: y, schemaType: S } = Et(I);
|
|
649
650
|
if (S !== "mieforms" && S !== "surveyjs") {
|
|
650
651
|
alert(`Unsupported or invalid schema format.
|
|
651
652
|
|
|
@@ -653,14 +654,14 @@ Expected: MIE Forms or SurveyJS
|
|
|
653
654
|
Detected: ${S}`);
|
|
654
655
|
return;
|
|
655
656
|
}
|
|
656
|
-
|
|
657
|
-
} catch (
|
|
657
|
+
a({ data: y, detectedSchemaType: S }), r(!0);
|
|
658
|
+
} catch (I) {
|
|
658
659
|
alert(`Failed to parse file:
|
|
659
660
|
|
|
660
|
-
${(
|
|
661
|
+
${(I == null ? void 0 : I.message) || "Invalid file format"}`);
|
|
661
662
|
}
|
|
662
|
-
},
|
|
663
|
-
var
|
|
663
|
+
}, x = (E) => {
|
|
664
|
+
var I;
|
|
664
665
|
if (s)
|
|
665
666
|
try {
|
|
666
667
|
const { data: y } = s, S = Nt(y, E), p = S.fields || [];
|
|
@@ -671,38 +672,38 @@ ${(O == null ? void 0 : O.message) || "Invalid file format"}`);
|
|
|
671
672
|
schemaType: E === "surveyjs" ? "mieforms-v1.0" : y.schemaType || "mieforms-v1.0",
|
|
672
673
|
fields: p
|
|
673
674
|
};
|
|
674
|
-
if (E === "surveyjs" && ((
|
|
675
|
+
if (E === "surveyjs" && ((I = S.conversionReport) != null && I.surveyMetadata))
|
|
675
676
|
Object.assign(N, S.conversionReport.surveyMetadata);
|
|
676
677
|
else if (E === "mieforms") {
|
|
677
|
-
const { fields: L, schemaType:
|
|
678
|
+
const { fields: L, schemaType: q, ...B } = y;
|
|
678
679
|
Object.keys(B).length > 0 && Object.assign(N, B);
|
|
679
680
|
}
|
|
680
|
-
|
|
681
|
+
o(N), c.selectedFieldId.clear(), c.preview.set(!1), alert(`✅ Import successful!
|
|
681
682
|
|
|
682
683
|
Format: ${E === "surveyjs" ? "SurveyJS" : "MIE Forms"}
|
|
683
|
-
Loaded ${p.length} field(s)`), r(!1),
|
|
684
|
+
Loaded ${p.length} field(s)`), r(!1), a(null);
|
|
684
685
|
} catch (y) {
|
|
685
686
|
alert(`Import failed:
|
|
686
687
|
|
|
687
|
-
${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1),
|
|
688
|
+
${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), a(null);
|
|
688
689
|
}
|
|
689
690
|
}, i = () => {
|
|
690
|
-
r(!1),
|
|
691
|
+
r(!1), a(null);
|
|
691
692
|
}, A = () => {
|
|
692
693
|
c.preview.set(!1), c.codeEditor.set(!1);
|
|
693
694
|
}, T = () => {
|
|
694
695
|
c.preview.set(!1), c.codeEditor.set(!0);
|
|
695
|
-
},
|
|
696
|
+
}, W = () => {
|
|
696
697
|
c.preview.set(!0), c.codeEditor.set(!1), c.selectedFieldId.clear();
|
|
697
698
|
}, j = () => {
|
|
698
|
-
const E = JSON.stringify(l, null, 2),
|
|
699
|
+
const E = JSON.stringify(l, null, 2), I = new Blob([E], { type: "application/json" }), y = URL.createObjectURL(I), S = document.createElement("a");
|
|
699
700
|
S.href = y, S.download = "questionnaire.json", S.click(), URL.revokeObjectURL(y);
|
|
700
701
|
};
|
|
701
702
|
return /* @__PURE__ */ t.jsxs("header", { className: "editor-header w-full bg-white border border-gray-200 rounded-lg shadow-sm", children: [
|
|
702
703
|
/* @__PURE__ */ t.jsxs("div", { className: "px-4 py-4", children: [
|
|
703
704
|
/* @__PURE__ */ t.jsx("div", { className: "mb-4", children: /* @__PURE__ */ t.jsx("h1", { className: "text-lg lg:text-2xl font-bold text-slate-900", children: "Editor" }) }),
|
|
704
|
-
/* @__PURE__ */ t.jsxs("div", { className: "flex
|
|
705
|
-
/* @__PURE__ */ t.jsxs("div", { className: "header-mode-toggle flex gap-1 rounded-lg border border-black/10 bg-black/5 p-1 w-fit
|
|
705
|
+
/* @__PURE__ */ t.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
|
|
706
|
+
/* @__PURE__ */ t.jsxs("div", { className: "header-mode-toggle flex gap-1 rounded-lg border border-black/10 bg-black/5 p-1 w-fit", children: [
|
|
706
707
|
/* @__PURE__ */ t.jsxs(
|
|
707
708
|
"button",
|
|
708
709
|
{
|
|
@@ -711,7 +712,7 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
711
712
|
title: "Visual Editor",
|
|
712
713
|
children: [
|
|
713
714
|
/* @__PURE__ */ t.jsx(cr, { className: "w-5 h-5" }),
|
|
714
|
-
/* @__PURE__ */ t.jsx("span", { children: "
|
|
715
|
+
/* @__PURE__ */ t.jsx("span", { children: "Build" })
|
|
715
716
|
]
|
|
716
717
|
}
|
|
717
718
|
),
|
|
@@ -723,7 +724,7 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
723
724
|
title: "Code Editor",
|
|
724
725
|
children: [
|
|
725
726
|
/* @__PURE__ */ t.jsx(dr, { className: "w-5 h-5" }),
|
|
726
|
-
/* @__PURE__ */ t.jsx("span", { children: "Code
|
|
727
|
+
/* @__PURE__ */ t.jsx("span", { children: "Code" })
|
|
727
728
|
]
|
|
728
729
|
}
|
|
729
730
|
),
|
|
@@ -731,7 +732,7 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
731
732
|
"button",
|
|
732
733
|
{
|
|
733
734
|
className: `flex items-center justify-center gap-2 px-2 lg:px-4 py-2 lg:py-2 rounded-lg text-xs lg:text-sm font-medium transition-colors ${f ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
734
|
-
onClick:
|
|
735
|
+
onClick: W,
|
|
735
736
|
title: "Preview",
|
|
736
737
|
children: [
|
|
737
738
|
/* @__PURE__ */ t.jsx(ur, { className: "w-5 h-5" }),
|
|
@@ -740,10 +741,10 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
740
741
|
}
|
|
741
742
|
)
|
|
742
743
|
] }),
|
|
743
|
-
/* @__PURE__ */ t.jsxs("div", { className: "header-actions flex
|
|
744
|
+
/* @__PURE__ */ t.jsxs("div", { className: "header-actions flex gap-1 items-center", children: [
|
|
744
745
|
/* @__PURE__ */ t.jsxs("label", { className: "header-import-label px-2 py-2 lg:px-3 lg:py-2 rounded-lg border border-black/15 bg-white hover:bg-black/5 cursor-pointer text-xs lg:text-sm font-medium transition-colors flex items-center lg:gap-2 gap-0", children: [
|
|
745
746
|
/* @__PURE__ */ t.jsx(fr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
|
|
746
|
-
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[
|
|
747
|
+
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[445px]:inline", children: "Import" }),
|
|
747
748
|
/* @__PURE__ */ t.jsx(
|
|
748
749
|
"input",
|
|
749
750
|
{
|
|
@@ -752,13 +753,13 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
752
753
|
accept: ".json,.yaml,.yml,application/json,text/yaml",
|
|
753
754
|
onChange: (E) => {
|
|
754
755
|
var S;
|
|
755
|
-
const
|
|
756
|
-
if (!
|
|
756
|
+
const I = (S = E.target.files) == null ? void 0 : S[0];
|
|
757
|
+
if (!I) return;
|
|
757
758
|
const y = new FileReader();
|
|
758
759
|
y.onload = (p) => {
|
|
759
760
|
var N;
|
|
760
761
|
return h(((N = p.target) == null ? void 0 : N.result) ?? "");
|
|
761
|
-
}, y.readAsText(
|
|
762
|
+
}, y.readAsText(I), E.target.value = "";
|
|
762
763
|
}
|
|
763
764
|
}
|
|
764
765
|
)
|
|
@@ -771,7 +772,7 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
771
772
|
title: "Export",
|
|
772
773
|
children: [
|
|
773
774
|
/* @__PURE__ */ t.jsx(mr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
|
|
774
|
-
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[
|
|
775
|
+
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[445px]:inline", children: "Export" })
|
|
775
776
|
]
|
|
776
777
|
}
|
|
777
778
|
)
|
|
@@ -792,7 +793,7 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
792
793
|
/* @__PURE__ */ t.jsx(
|
|
793
794
|
"button",
|
|
794
795
|
{
|
|
795
|
-
onClick: () =>
|
|
796
|
+
onClick: () => x(s.detectedSchemaType),
|
|
796
797
|
className: "flex-1 px-6 py-3 rounded-xl bg-blue-500 text-white font-semibold hover:bg-blue-600 transition-colors shadow-sm hover:shadow",
|
|
797
798
|
children: "Yes, Import"
|
|
798
799
|
}
|
|
@@ -809,16 +810,16 @@ ${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
|
809
810
|
] }) })
|
|
810
811
|
] });
|
|
811
812
|
}
|
|
812
|
-
const
|
|
813
|
+
const Dr = (e) => {
|
|
813
814
|
switch (e) {
|
|
814
815
|
case "Text Fields":
|
|
815
816
|
return jr;
|
|
816
817
|
case "Organization":
|
|
817
818
|
return yr;
|
|
818
819
|
case "Selection Fields":
|
|
819
|
-
return vr;
|
|
820
|
-
case "Rating & Ranking":
|
|
821
820
|
return xr;
|
|
821
|
+
case "Rating & Ranking":
|
|
822
|
+
return vr;
|
|
822
823
|
case "Matrix Fields":
|
|
823
824
|
return br;
|
|
824
825
|
case "Rich Content":
|
|
@@ -826,41 +827,41 @@ const Mr = (e) => {
|
|
|
826
827
|
default:
|
|
827
828
|
return null;
|
|
828
829
|
}
|
|
829
|
-
},
|
|
830
|
+
}, Lr = ({ isPreview: e = !1 }) => {
|
|
830
831
|
if (e) return null;
|
|
831
|
-
const r = re((h) => h.addField), s =
|
|
832
|
+
const r = re((h) => h.addField), s = oe(), a = re(
|
|
832
833
|
Te(
|
|
833
834
|
(h) => s.selectedFieldId.value ? h.byId[s.selectedFieldId.value] : null,
|
|
834
835
|
[s.selectedFieldId.value]
|
|
835
836
|
)
|
|
836
|
-
),
|
|
837
|
+
), o = (a == null ? void 0 : a.fieldType) === "section", l = (a == null ? void 0 : a.title) || "Section", c = m.useCallback(() => {
|
|
837
838
|
s.selectedFieldId.set(null);
|
|
838
839
|
}, [s.selectedFieldId]);
|
|
839
840
|
m.useEffect(() => {
|
|
840
|
-
const h = (
|
|
841
|
-
|
|
841
|
+
const h = (x) => {
|
|
842
|
+
x.key === "Escape" && (x.preventDefault(), x.stopPropagation(), c());
|
|
842
843
|
};
|
|
843
844
|
return window.addEventListener("keydown", h), () => window.removeEventListener("keydown", h);
|
|
844
845
|
}, [c]);
|
|
845
846
|
const f = Ye(() => {
|
|
846
847
|
const h = {};
|
|
847
|
-
return Object.entries(de).filter(([
|
|
848
|
+
return Object.entries(de).filter(([x]) => x !== "unsupported").forEach(([x, i]) => {
|
|
848
849
|
const A = i.category || "Other";
|
|
849
850
|
h[A] || (h[A] = []), h[A].push({
|
|
850
|
-
type:
|
|
851
|
+
type: x,
|
|
851
852
|
label: i.label
|
|
852
853
|
});
|
|
853
854
|
}), h;
|
|
854
855
|
}, []), u = Ye(() => {
|
|
855
856
|
const h = {};
|
|
856
|
-
return Object.values(f).forEach((
|
|
857
|
-
|
|
857
|
+
return Object.values(f).forEach((x) => {
|
|
858
|
+
x.forEach(({ type: i }) => {
|
|
858
859
|
h[i] = () => {
|
|
859
|
-
|
|
860
|
+
o && (a != null && a.id) ? r(i, { sectionId: a.id }) : r(i);
|
|
860
861
|
};
|
|
861
862
|
});
|
|
862
863
|
}), h;
|
|
863
|
-
}, [f, r,
|
|
864
|
+
}, [f, r, o, a == null ? void 0 : a.id]);
|
|
864
865
|
return /* @__PURE__ */ t.jsx(
|
|
865
866
|
"div",
|
|
866
867
|
{
|
|
@@ -869,29 +870,29 @@ const Mr = (e) => {
|
|
|
869
870
|
children: /* @__PURE__ */ t.jsxs("div", { className: "tool-panel-container pb-4 rounded-lg shadow-sm", children: [
|
|
870
871
|
/* @__PURE__ */ t.jsxs("h3", { className: "tool-panel-title sticky top-0 z-20 bg-white text-base font-semibold pb-2 pt-3 px-4 border-b border-gray-200 flex items-center justify-between gap-2", children: [
|
|
871
872
|
/* @__PURE__ */ t.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
|
|
872
|
-
/* @__PURE__ */ t.jsx(hr, { className: "w-5 h-5 text-gray-700
|
|
873
|
-
/* @__PURE__ */ t.jsx("span", { className: "truncate", children:
|
|
873
|
+
/* @__PURE__ */ t.jsx(hr, { className: "w-5 h-5 text-gray-700 shrink-0" }),
|
|
874
|
+
/* @__PURE__ */ t.jsx("span", { className: "truncate", children: o ? `Add to "${l}"` : "Tools" })
|
|
874
875
|
] }),
|
|
875
|
-
|
|
876
|
+
o && /* @__PURE__ */ t.jsx(
|
|
876
877
|
"button",
|
|
877
878
|
{
|
|
878
879
|
onClick: c,
|
|
879
|
-
className: "text-gray-600 hover:text-red-600 hover:bg-red-50 p-1 rounded transition-colors
|
|
880
|
+
className: "text-gray-600 hover:text-red-600 hover:bg-red-50 p-1 rounded transition-colors shrink-0",
|
|
880
881
|
title: "Unselect section",
|
|
881
882
|
children: /* @__PURE__ */ t.jsx(pr, { className: "w-5 h-5" })
|
|
882
883
|
}
|
|
883
884
|
)
|
|
884
885
|
] }),
|
|
885
|
-
Object.entries(f).map(([h,
|
|
886
|
+
Object.entries(f).map(([h, x]) => /* @__PURE__ */ t.jsxs("div", { className: "tool-category", children: [
|
|
886
887
|
/* @__PURE__ */ t.jsxs("h4", { className: "sticky top-11 z-10 bg-gray-50 text-sm font-semibold text-gray-700 px-4 py-3 border-b border-gray-100 uppercase tracking-wide flex items-center gap-2", children: [
|
|
887
888
|
(() => {
|
|
888
|
-
const i =
|
|
889
|
+
const i = Dr(h);
|
|
889
890
|
return i ? /* @__PURE__ */ t.jsx(i, { className: "w-4 h-4 text-gray-600" }) : null;
|
|
890
891
|
})(),
|
|
891
892
|
h
|
|
892
893
|
] }),
|
|
893
|
-
/* @__PURE__ */ t.jsx("div", { className: "tool-items grid grid-cols-1 gap-2 px-4 py-3", children:
|
|
894
|
-
const T =
|
|
894
|
+
/* @__PURE__ */ t.jsx("div", { className: "tool-items grid grid-cols-1 gap-2 px-4 py-3", children: x.map(({ type: i, label: A }) => {
|
|
895
|
+
const T = o && i === "section";
|
|
895
896
|
return /* @__PURE__ */ t.jsxs(
|
|
896
897
|
"button",
|
|
897
898
|
{
|
|
@@ -911,28 +912,28 @@ const Mr = (e) => {
|
|
|
911
912
|
] })
|
|
912
913
|
}
|
|
913
914
|
);
|
|
914
|
-
}, mt = m.memo(
|
|
915
|
+
}, mt = m.memo(Lr, (e, r) => e.isPreview === r.isPreview);
|
|
915
916
|
function Ot({
|
|
916
917
|
id: e = "",
|
|
917
918
|
label: r = "ID",
|
|
918
919
|
onCommit: s,
|
|
919
|
-
validate:
|
|
920
|
-
placeholder:
|
|
920
|
+
validate: a,
|
|
921
|
+
placeholder: o = "Enter unique ID…",
|
|
921
922
|
className: l = ""
|
|
922
923
|
}) {
|
|
923
924
|
const [c, f] = m.useState(e ?? ""), [u, h] = m.useState("");
|
|
924
925
|
m.useEffect(() => {
|
|
925
926
|
f(e ?? ""), h("");
|
|
926
927
|
}, [e]);
|
|
927
|
-
const
|
|
928
|
+
const x = m.useCallback(() => {
|
|
928
929
|
const i = String(c ?? "").trim();
|
|
929
930
|
if (!i) {
|
|
930
931
|
h("ID cannot be empty."), f(e ?? "");
|
|
931
932
|
return;
|
|
932
933
|
}
|
|
933
934
|
if (i !== (e ?? "")) {
|
|
934
|
-
if (typeof
|
|
935
|
-
const A =
|
|
935
|
+
if (typeof a == "function") {
|
|
936
|
+
const A = a(i, e ?? "");
|
|
936
937
|
if (A) {
|
|
937
938
|
h(A);
|
|
938
939
|
return;
|
|
@@ -940,7 +941,7 @@ function Ot({
|
|
|
940
941
|
}
|
|
941
942
|
s == null || s(i);
|
|
942
943
|
}
|
|
943
|
-
}, [c, e, s,
|
|
944
|
+
}, [c, e, s, a]);
|
|
944
945
|
return /* @__PURE__ */ t.jsxs("div", { className: l ? `draft-id-editor-container ${l}` : "draft-id-editor-container", children: [
|
|
945
946
|
/* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: r }),
|
|
946
947
|
/* @__PURE__ */ t.jsx(
|
|
@@ -951,32 +952,32 @@ function Ot({
|
|
|
951
952
|
onChange: (i) => {
|
|
952
953
|
u && h(""), f(i.target.value);
|
|
953
954
|
},
|
|
954
|
-
onBlur:
|
|
955
|
+
onBlur: x,
|
|
955
956
|
onKeyDown: (i) => {
|
|
956
|
-
i.key === "Enter" && (i.preventDefault(),
|
|
957
|
+
i.key === "Enter" && (i.preventDefault(), x());
|
|
957
958
|
},
|
|
958
|
-
placeholder:
|
|
959
|
+
placeholder: o
|
|
959
960
|
}
|
|
960
961
|
),
|
|
961
962
|
u ? /* @__PURE__ */ t.jsx("p", { className: "text-xs text-red-600 mt-1", children: u }) : null
|
|
962
963
|
] });
|
|
963
964
|
}
|
|
964
|
-
function
|
|
965
|
-
const s = re(m.useCallback((
|
|
966
|
-
if (!(
|
|
967
|
-
if (
|
|
965
|
+
function It({ f: e, onUpdateField: r }) {
|
|
966
|
+
const s = re(m.useCallback((o) => o.byId, [])), a = m.useCallback((o, l) => {
|
|
967
|
+
if (!(o != null && o.trim())) return "ID cannot be empty.";
|
|
968
|
+
if (o === l) return "";
|
|
968
969
|
const c = new Set(Object.keys(s));
|
|
969
970
|
return Object.values(s).forEach((f) => {
|
|
970
971
|
(f == null ? void 0 : f.fieldType) === "section" && Array.isArray(f.fields) && f.fields.forEach((u) => c.add(u.id));
|
|
971
|
-
}), c.has(
|
|
972
|
+
}), c.has(o) ? `ID "${o}" already exists.` : "";
|
|
972
973
|
}, [s]);
|
|
973
974
|
return /* @__PURE__ */ t.jsxs("div", { className: "common-editor-container space-y-3", children: [
|
|
974
975
|
/* @__PURE__ */ t.jsx(
|
|
975
976
|
Ot,
|
|
976
977
|
{
|
|
977
978
|
id: e.id ?? "",
|
|
978
|
-
validate:
|
|
979
|
-
onCommit: (
|
|
979
|
+
validate: a,
|
|
980
|
+
onCommit: (o) => r == null ? void 0 : r("id", o)
|
|
980
981
|
}
|
|
981
982
|
),
|
|
982
983
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
@@ -986,7 +987,7 @@ function St({ f: e, onUpdateField: r }) {
|
|
|
986
987
|
{
|
|
987
988
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
988
989
|
value: e.question || "",
|
|
989
|
-
onChange: (
|
|
990
|
+
onChange: (o) => r("question", o.target.value),
|
|
990
991
|
placeholder: "Enter question text"
|
|
991
992
|
}
|
|
992
993
|
)
|
|
@@ -997,7 +998,7 @@ function St({ f: e, onUpdateField: r }) {
|
|
|
997
998
|
{
|
|
998
999
|
type: "checkbox",
|
|
999
1000
|
checked: !!e.required,
|
|
1000
|
-
onChange: (
|
|
1001
|
+
onChange: (o) => r("required", o.target.checked)
|
|
1001
1002
|
}
|
|
1002
1003
|
),
|
|
1003
1004
|
"Required"
|
|
@@ -1009,44 +1010,44 @@ function St({ f: e, onUpdateField: r }) {
|
|
|
1009
1010
|
{
|
|
1010
1011
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
1011
1012
|
value: e.sublabel || "",
|
|
1012
|
-
onChange: (
|
|
1013
|
+
onChange: (o) => r("sublabel", o.target.value),
|
|
1013
1014
|
placeholder: "Helper text / description"
|
|
1014
1015
|
}
|
|
1015
1016
|
)
|
|
1016
1017
|
] })
|
|
1017
1018
|
] });
|
|
1018
1019
|
}
|
|
1019
|
-
function
|
|
1020
|
-
const s = e.options || [],
|
|
1020
|
+
function St({ field: e, api: r }) {
|
|
1021
|
+
const s = e.options || [], a = e.fieldType === "boolean", o = e.fieldType === "multitext", l = m.useRef(null), c = m.useRef(s.length), f = o ? "Text Inputs" : "Options", u = o ? "Text Input" : "Option", h = o ? "Input label" : "Option text";
|
|
1021
1022
|
return m.useEffect(() => {
|
|
1022
1023
|
if (s.length > c.current && l.current) {
|
|
1023
|
-
const
|
|
1024
|
-
|
|
1024
|
+
const x = l.current.lastElementChild;
|
|
1025
|
+
x && x.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1025
1026
|
}
|
|
1026
1027
|
c.current = s.length;
|
|
1027
1028
|
}, [s.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1028
1029
|
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: f }),
|
|
1029
|
-
/* @__PURE__ */ t.jsx("div", { ref: l, className: "space-y-2", children: s.map((
|
|
1030
|
+
/* @__PURE__ */ t.jsx("div", { ref: l, className: "space-y-2", children: s.map((x) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg shadow-sm hover:border-gray-400 transition-colors", children: [
|
|
1030
1031
|
/* @__PURE__ */ t.jsx(
|
|
1031
1032
|
"input",
|
|
1032
1033
|
{
|
|
1033
1034
|
className: "flex-1 min-w-0 outline-none bg-transparent",
|
|
1034
|
-
value:
|
|
1035
|
-
onChange: (i) => r.option.update(
|
|
1035
|
+
value: x.value,
|
|
1036
|
+
onChange: (i) => r.option.update(x.id, i.target.value),
|
|
1036
1037
|
placeholder: h
|
|
1037
1038
|
}
|
|
1038
1039
|
),
|
|
1039
|
-
!
|
|
1040
|
+
!a && /* @__PURE__ */ t.jsx(
|
|
1040
1041
|
"button",
|
|
1041
1042
|
{
|
|
1042
|
-
onClick: () => r.option.remove(
|
|
1043
|
+
onClick: () => r.option.remove(x.id),
|
|
1043
1044
|
className: "flex-shrink-0 text-gray-400 hover:text-red-600 transition-colors",
|
|
1044
1045
|
title: "Remove option",
|
|
1045
1046
|
children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
|
|
1046
1047
|
}
|
|
1047
1048
|
)
|
|
1048
|
-
] },
|
|
1049
|
-
!
|
|
1049
|
+
] }, x.id)) }),
|
|
1050
|
+
!a && /* @__PURE__ */ t.jsxs(
|
|
1050
1051
|
"button",
|
|
1051
1052
|
{
|
|
1052
1053
|
onClick: () => r.option.add(""),
|
|
@@ -1060,23 +1061,23 @@ function It({ field: e, api: r }) {
|
|
|
1060
1061
|
] });
|
|
1061
1062
|
}
|
|
1062
1063
|
function Rt({ field: e, api: r }) {
|
|
1063
|
-
const s = e.rows || [],
|
|
1064
|
+
const s = e.rows || [], a = e.columns || [], o = m.useRef(null), l = m.useRef(null), c = m.useRef(s.length), f = m.useRef(a.length);
|
|
1064
1065
|
return m.useEffect(() => {
|
|
1065
|
-
if (s.length > c.current &&
|
|
1066
|
-
const u =
|
|
1066
|
+
if (s.length > c.current && o.current) {
|
|
1067
|
+
const u = o.current.lastElementChild;
|
|
1067
1068
|
u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1068
1069
|
}
|
|
1069
1070
|
c.current = s.length;
|
|
1070
1071
|
}, [s.length]), m.useEffect(() => {
|
|
1071
|
-
if (
|
|
1072
|
+
if (a.length > f.current && l.current) {
|
|
1072
1073
|
const u = l.current.lastElementChild;
|
|
1073
1074
|
u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1074
1075
|
}
|
|
1075
|
-
f.current =
|
|
1076
|
-
}, [
|
|
1076
|
+
f.current = a.length;
|
|
1077
|
+
}, [a.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-4", children: [
|
|
1077
1078
|
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1078
1079
|
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Rows" }),
|
|
1079
|
-
/* @__PURE__ */ t.jsx("div", { ref:
|
|
1080
|
+
/* @__PURE__ */ t.jsx("div", { ref: o, className: "space-y-2", children: s.map((u) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg shadow-sm hover:border-gray-400 transition-colors", children: [
|
|
1080
1081
|
/* @__PURE__ */ t.jsx(
|
|
1081
1082
|
"input",
|
|
1082
1083
|
{
|
|
@@ -1107,7 +1108,7 @@ function Rt({ field: e, api: r }) {
|
|
|
1107
1108
|
] }),
|
|
1108
1109
|
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1109
1110
|
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Columns" }),
|
|
1110
|
-
/* @__PURE__ */ t.jsx("div", { ref: l, className: "space-y-2", children:
|
|
1111
|
+
/* @__PURE__ */ t.jsx("div", { ref: l, className: "space-y-2", children: a.map((u) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg shadow-sm hover:border-gray-400 transition-colors", children: [
|
|
1111
1112
|
/* @__PURE__ */ t.jsx(
|
|
1112
1113
|
"input",
|
|
1113
1114
|
{
|
|
@@ -1127,7 +1128,7 @@ function Rt({ field: e, api: r }) {
|
|
|
1127
1128
|
}
|
|
1128
1129
|
)
|
|
1129
1130
|
] }, u.id)) }),
|
|
1130
|
-
|
|
1131
|
+
a.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "px-3 py-2 text-sm text-gray-500 text-center bg-gray-50 rounded-lg", children: "Max columns reached (10)" }) : /* @__PURE__ */ t.jsx(
|
|
1131
1132
|
"button",
|
|
1132
1133
|
{
|
|
1133
1134
|
onClick: () => r.column.add(""),
|
|
@@ -1138,14 +1139,14 @@ function Rt({ field: e, api: r }) {
|
|
|
1138
1139
|
] })
|
|
1139
1140
|
] });
|
|
1140
1141
|
}
|
|
1141
|
-
function
|
|
1142
|
+
function $r({ f: e }) {
|
|
1142
1143
|
const r = Je(e.id), s = m.useCallback(
|
|
1143
1144
|
(c, f) => r.field.update(c, f),
|
|
1144
1145
|
[r]
|
|
1145
|
-
),
|
|
1146
|
+
), a = de[e.fieldType] || {}, o = a.hasOptions || !1, l = a.hasMatrix || !1;
|
|
1146
1147
|
return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1147
1148
|
/* @__PURE__ */ t.jsx("h3", { className: "text-lg font-semibold mb-3", children: "Edit" }),
|
|
1148
|
-
/* @__PURE__ */ t.jsx(
|
|
1149
|
+
/* @__PURE__ */ t.jsx(It, { f: e, onUpdateField: s }),
|
|
1149
1150
|
e.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "non-section-editor-default-answer mt-4", children: [
|
|
1150
1151
|
/* @__PURE__ */ t.jsx("div", { className: "text-sm font-medium mb-1", children: "Default Answer" }),
|
|
1151
1152
|
/* @__PURE__ */ t.jsx(
|
|
@@ -1158,19 +1159,19 @@ function Dr({ f: e }) {
|
|
|
1158
1159
|
}
|
|
1159
1160
|
)
|
|
1160
1161
|
] }),
|
|
1161
|
-
|
|
1162
|
+
o && /* @__PURE__ */ t.jsx(St, { field: e, api: r }),
|
|
1162
1163
|
l && /* @__PURE__ */ t.jsx(Rt, { field: e, api: r })
|
|
1163
1164
|
] });
|
|
1164
1165
|
}
|
|
1165
|
-
function
|
|
1166
|
+
function qr({ section: e, onActiveChildChange: r }) {
|
|
1166
1167
|
var y, S;
|
|
1167
|
-
const s = Je(e.id),
|
|
1168
|
-
if (!
|
|
1168
|
+
const s = Je(e.id), a = m.useContext(He), o = oe();
|
|
1169
|
+
if (!a) throw new Error("Missing FormStoreContext.Provider in the tree");
|
|
1169
1170
|
const l = Array.isArray(e.fields) ? e.fields : [], [c, f] = m.useState(((y = l[0]) == null ? void 0 : y.id) || null);
|
|
1170
1171
|
m.useEffect(() => {
|
|
1171
|
-
const p =
|
|
1172
|
+
const p = o.selectedChildId.ParentId, N = o.selectedChildId.ChildId;
|
|
1172
1173
|
p === e.id && N && f(N);
|
|
1173
|
-
}, [
|
|
1174
|
+
}, [o.selectedChildId.ParentId, o.selectedChildId.ChildId, e.id]), m.useEffect(() => {
|
|
1174
1175
|
var p;
|
|
1175
1176
|
f(((p = l[0]) == null ? void 0 : p.id) || null);
|
|
1176
1177
|
}, [e.id]), m.useEffect(() => {
|
|
@@ -1184,50 +1185,50 @@ function Lr({ section: e, onActiveChildChange: r }) {
|
|
|
1184
1185
|
}, [e.id, c, r]);
|
|
1185
1186
|
const u = m.useCallback(
|
|
1186
1187
|
(p) => {
|
|
1187
|
-
f(p),
|
|
1188
|
+
f(p), o.selectedChildId.set(e.id, p);
|
|
1188
1189
|
},
|
|
1189
|
-
[e.id,
|
|
1190
|
+
[e.id, o.selectedChildId]
|
|
1190
1191
|
), h = m.useCallback((p) => {
|
|
1191
1192
|
var N, L;
|
|
1192
1193
|
return ((N = p.question) == null ? void 0 : N.trim()) || ((L = de[p.fieldType]) == null ? void 0 : L.label) || "Untitled";
|
|
1193
|
-
}, []),
|
|
1194
|
+
}, []), x = m.useCallback(
|
|
1194
1195
|
(p, N) => s.field.update(p, N),
|
|
1195
1196
|
[s]
|
|
1196
1197
|
), i = m.useMemo(
|
|
1197
1198
|
() => l.find((p) => p.id === c) || null,
|
|
1198
1199
|
[l, c]
|
|
1199
|
-
), A = Je((i == null ? void 0 : i.id) || "", e.id), T = i && A ? A : null,
|
|
1200
|
+
), A = Je((i == null ? void 0 : i.id) || "", e.id), T = i && A ? A : null, W = m.useCallback(
|
|
1200
1201
|
(p, N) => {
|
|
1201
1202
|
if (i) {
|
|
1202
1203
|
if (p === "id") {
|
|
1203
1204
|
const L = String(N ?? "").trim();
|
|
1204
1205
|
if (!L) return;
|
|
1205
|
-
|
|
1206
|
+
a.getState().updateField(
|
|
1206
1207
|
i.id,
|
|
1207
1208
|
{ id: L },
|
|
1208
1209
|
{
|
|
1209
1210
|
sectionId: e.id,
|
|
1210
|
-
onIdChange: (
|
|
1211
|
-
f((U) => U === B ?
|
|
1211
|
+
onIdChange: (q, B) => {
|
|
1212
|
+
f((U) => U === B ? q : U);
|
|
1212
1213
|
}
|
|
1213
1214
|
}
|
|
1214
1215
|
);
|
|
1215
1216
|
return;
|
|
1216
1217
|
}
|
|
1217
|
-
|
|
1218
|
+
a.getState().updateField(
|
|
1218
1219
|
i.id,
|
|
1219
1220
|
{ [p]: N },
|
|
1220
1221
|
{ sectionId: e.id }
|
|
1221
1222
|
);
|
|
1222
1223
|
}
|
|
1223
1224
|
},
|
|
1224
|
-
[i, e.id,
|
|
1225
|
+
[i, e.id, a]
|
|
1225
1226
|
), j = m.useCallback(() => {
|
|
1226
|
-
i &&
|
|
1227
|
-
}, [i, e.id,
|
|
1227
|
+
i && a.getState().deleteField(i.id, { sectionId: e.id });
|
|
1228
|
+
}, [i, e.id, a]), E = m.useMemo(
|
|
1228
1229
|
() => i && (de[i.fieldType] || {}).hasOptions || !1,
|
|
1229
1230
|
[i]
|
|
1230
|
-
),
|
|
1231
|
+
), I = m.useMemo(
|
|
1231
1232
|
() => i && (de[i.fieldType] || {}).hasMatrix || !1,
|
|
1232
1233
|
[i]
|
|
1233
1234
|
);
|
|
@@ -1248,7 +1249,7 @@ function Lr({ section: e, onActiveChildChange: r }) {
|
|
|
1248
1249
|
{
|
|
1249
1250
|
className: "w-full px-3 py-2 border border-gray-300 rounded focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none",
|
|
1250
1251
|
value: e.title || "",
|
|
1251
|
-
onChange: (p) =>
|
|
1252
|
+
onChange: (p) => x("title", p.target.value),
|
|
1252
1253
|
placeholder: "e.g., Patient Information"
|
|
1253
1254
|
}
|
|
1254
1255
|
)
|
|
@@ -1299,7 +1300,7 @@ function Lr({ section: e, onActiveChildChange: r }) {
|
|
|
1299
1300
|
}
|
|
1300
1301
|
)
|
|
1301
1302
|
] }),
|
|
1302
|
-
/* @__PURE__ */ t.jsx(
|
|
1303
|
+
/* @__PURE__ */ t.jsx(It, { f: i, onUpdateField: W }),
|
|
1303
1304
|
i.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "section-editor-default-answer", children: [
|
|
1304
1305
|
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Default Answer" }),
|
|
1305
1306
|
/* @__PURE__ */ t.jsx(
|
|
@@ -1307,19 +1308,21 @@ function Lr({ section: e, onActiveChildChange: r }) {
|
|
|
1307
1308
|
{
|
|
1308
1309
|
className: "w-full px-3 py-2 border border-gray-300 rounded focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none",
|
|
1309
1310
|
value: i.answer || "",
|
|
1310
|
-
onChange: (p) =>
|
|
1311
|
+
onChange: (p) => W("answer", p.target.value),
|
|
1311
1312
|
placeholder: "Default value"
|
|
1312
1313
|
}
|
|
1313
1314
|
)
|
|
1314
1315
|
] }),
|
|
1315
|
-
E && T && /* @__PURE__ */ t.jsx(
|
|
1316
|
-
|
|
1316
|
+
E && T && /* @__PURE__ */ t.jsx(St, { field: i, api: T }),
|
|
1317
|
+
I && T && /* @__PURE__ */ t.jsx(Rt, { field: i, api: T })
|
|
1317
1318
|
] })
|
|
1318
1319
|
] })
|
|
1319
1320
|
] })
|
|
1320
1321
|
] });
|
|
1321
1322
|
}
|
|
1322
|
-
function ht(e) {
|
|
1323
|
+
function ht(e, r) {
|
|
1324
|
+
if (e === "expression")
|
|
1325
|
+
return Cr.includes(r) ? ["equals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"] : ["equals", "contains"];
|
|
1323
1326
|
switch (e) {
|
|
1324
1327
|
case "input":
|
|
1325
1328
|
return ["equals", "contains"];
|
|
@@ -1332,95 +1335,117 @@ function ht(e) {
|
|
|
1332
1335
|
return ["equals"];
|
|
1333
1336
|
}
|
|
1334
1337
|
}
|
|
1338
|
+
function Wr(e) {
|
|
1339
|
+
switch (e) {
|
|
1340
|
+
case "equals":
|
|
1341
|
+
return "= (equals)";
|
|
1342
|
+
case "greaterThan":
|
|
1343
|
+
return "> (greater than)";
|
|
1344
|
+
case "greaterThanOrEqual":
|
|
1345
|
+
return "≥ (greater than or equal)";
|
|
1346
|
+
case "lessThan":
|
|
1347
|
+
return "< (less than)";
|
|
1348
|
+
case "lessThanOrEqual":
|
|
1349
|
+
return "≤ (less than or equal)";
|
|
1350
|
+
case "contains":
|
|
1351
|
+
return "contains";
|
|
1352
|
+
case "includes":
|
|
1353
|
+
return "includes";
|
|
1354
|
+
default:
|
|
1355
|
+
return e;
|
|
1356
|
+
}
|
|
1357
|
+
}
|
|
1335
1358
|
function pt(e) {
|
|
1336
1359
|
if (e && typeof e == "object") {
|
|
1337
|
-
const s = e.id ?? String(e.value ?? ""),
|
|
1338
|
-
return { id: s, value:
|
|
1360
|
+
const s = e.id ?? String(e.value ?? ""), a = String(e.value ?? e.label ?? e.id ?? "");
|
|
1361
|
+
return { id: s, value: a };
|
|
1339
1362
|
}
|
|
1340
1363
|
const r = String(e ?? "");
|
|
1341
1364
|
return { id: r, value: r };
|
|
1342
1365
|
}
|
|
1343
|
-
function
|
|
1366
|
+
function Ur() {
|
|
1344
1367
|
var te, ne, G;
|
|
1345
|
-
const e =
|
|
1368
|
+
const e = oe(), r = re((v) => v.byId), s = re((v) => v.setEnableWhen), a = re((v) => v.updateField), o = ((te = e == null ? void 0 : e.selectedFieldId) == null ? void 0 : te.value) ?? null;
|
|
1346
1369
|
(ne = e == null ? void 0 : e.selectedChildId) == null || ne.ParentId;
|
|
1347
|
-
const l = ((G = e == null ? void 0 : e.selectedChildId) == null ? void 0 : G.ChildId) ?? null, c =
|
|
1370
|
+
const l = ((G = e == null ? void 0 : e.selectedChildId) == null ? void 0 : G.ChildId) ?? null, c = o ? r[o] : null, f = (c == null ? void 0 : c.fieldType) === "section", u = m.useMemo(() => f ? Array.isArray(c == null ? void 0 : c.fields) ? c.fields : [] : [], [f, c]), h = m.useMemo(() => !f || !l ? !1 : u.some((v) => v.id === l), [f, l, u]), x = m.useMemo(() => f && h ? `child:${l}` : "", [f, h, l]), [i, A] = m.useState(x);
|
|
1348
1371
|
m.useEffect(() => {
|
|
1349
|
-
A(
|
|
1350
|
-
}, [
|
|
1372
|
+
A(x);
|
|
1373
|
+
}, [x]), m.useEffect(() => {
|
|
1351
1374
|
if (f)
|
|
1352
1375
|
if (i && i.startsWith("child:")) {
|
|
1353
|
-
const
|
|
1354
|
-
e.selectedChildId.set(
|
|
1376
|
+
const v = i.slice(6);
|
|
1377
|
+
e.selectedChildId.set(o, v);
|
|
1355
1378
|
} else
|
|
1356
1379
|
e.selectedChildId.set(null, null);
|
|
1357
|
-
}, [f, i,
|
|
1358
|
-
const T = !!(f && i && i.startsWith("child:")),
|
|
1359
|
-
var g, w,
|
|
1360
|
-
const
|
|
1361
|
-
for (const
|
|
1362
|
-
if (
|
|
1363
|
-
if (
|
|
1364
|
-
const J = ((g =
|
|
1365
|
-
|
|
1380
|
+
}, [f, i, o, e]);
|
|
1381
|
+
const T = !!(f && i && i.startsWith("child:")), W = T ? i.slice(6) : null, j = T ? W : o, E = m.useMemo(() => j ? T ? u.find((v) => v.id === W) ?? null : r[j] ?? null : null, [r, j, T, W, u]), I = m.useMemo(() => {
|
|
1382
|
+
var g, w, V;
|
|
1383
|
+
const v = [];
|
|
1384
|
+
for (const M of Object.values(r))
|
|
1385
|
+
if (M)
|
|
1386
|
+
if (M.fieldType === "section" && Array.isArray(M.fields)) {
|
|
1387
|
+
const J = ((g = M.title) == null ? void 0 : g.trim()) || "Section";
|
|
1388
|
+
M.fields.forEach((O) => {
|
|
1366
1389
|
var R;
|
|
1367
|
-
|
|
1368
|
-
id:
|
|
1369
|
-
parentId:
|
|
1370
|
-
label: `${J} › ${((R =
|
|
1371
|
-
fieldType:
|
|
1372
|
-
|
|
1390
|
+
v.push({
|
|
1391
|
+
id: O.id,
|
|
1392
|
+
parentId: M.id,
|
|
1393
|
+
label: `${J} › ${((R = O.question) == null ? void 0 : R.trim()) || O.id}`,
|
|
1394
|
+
fieldType: O.fieldType,
|
|
1395
|
+
displayFormat: O.displayFormat,
|
|
1396
|
+
options: Array.isArray(O.options) ? O.options : []
|
|
1373
1397
|
});
|
|
1374
1398
|
});
|
|
1375
1399
|
} else
|
|
1376
|
-
|
|
1377
|
-
id:
|
|
1400
|
+
v.push({
|
|
1401
|
+
id: M.id,
|
|
1378
1402
|
parentId: null,
|
|
1379
|
-
label: ((w =
|
|
1380
|
-
fieldType:
|
|
1381
|
-
|
|
1403
|
+
label: ((w = M.question) == null ? void 0 : w.trim()) || ((V = M.title) == null ? void 0 : V.trim()) || M.id,
|
|
1404
|
+
fieldType: M.fieldType,
|
|
1405
|
+
displayFormat: M.displayFormat,
|
|
1406
|
+
options: Array.isArray(M.options) ? M.options : []
|
|
1382
1407
|
});
|
|
1383
|
-
return
|
|
1408
|
+
return v;
|
|
1384
1409
|
}, [r]), y = m.useCallback(
|
|
1385
|
-
(
|
|
1386
|
-
[
|
|
1410
|
+
(v) => I.find((g) => g.id === v) || null,
|
|
1411
|
+
[I]
|
|
1387
1412
|
), S = m.useCallback(
|
|
1388
|
-
(
|
|
1413
|
+
(v) => {
|
|
1389
1414
|
if (!j) return;
|
|
1390
|
-
const g =
|
|
1391
|
-
T &&
|
|
1415
|
+
const g = v && Array.isArray(v.conditions) ? { logic: v.logic || "AND", conditions: v.conditions } : void 0;
|
|
1416
|
+
T && o ? a(j, { enableWhen: g }, { sectionId: o }) : s(j, g);
|
|
1392
1417
|
},
|
|
1393
|
-
[j, T,
|
|
1418
|
+
[j, T, o, s, a]
|
|
1394
1419
|
), p = m.useMemo(() => E != null && E.enableWhen && Array.isArray(E.enableWhen.conditions) ? { logic: E.enableWhen.logic || "AND", conditions: E.enableWhen.conditions } : { logic: "AND", conditions: [] }, [E]), N = m.useCallback(() => {
|
|
1395
|
-
const
|
|
1420
|
+
const v = {
|
|
1396
1421
|
logic: p.logic || "AND",
|
|
1397
1422
|
conditions: [
|
|
1398
1423
|
...Array.isArray(p.conditions) ? p.conditions : [],
|
|
1399
1424
|
{ targetId: "", operator: "equals", value: "" }
|
|
1400
1425
|
]
|
|
1401
1426
|
};
|
|
1402
|
-
S(
|
|
1403
|
-
}, [p, S]), L = m.useCallback(() => S(null), [S]),
|
|
1404
|
-
(
|
|
1405
|
-
const w = (Array.isArray(p.conditions) ? p.conditions : []).filter((
|
|
1427
|
+
S(v);
|
|
1428
|
+
}, [p, S]), L = m.useCallback(() => S(null), [S]), q = m.useCallback(
|
|
1429
|
+
(v) => {
|
|
1430
|
+
const w = (Array.isArray(p.conditions) ? p.conditions : []).filter((V, M) => M !== v);
|
|
1406
1431
|
S({ ...p, conditions: w });
|
|
1407
1432
|
},
|
|
1408
1433
|
[p, S]
|
|
1409
1434
|
), B = m.useCallback(
|
|
1410
|
-
(
|
|
1411
|
-
const
|
|
1435
|
+
(v, g) => {
|
|
1436
|
+
const V = [...Array.isArray(p.conditions) ? p.conditions : []], J = { ...V[v] || { targetId: "", operator: "equals", value: "" }, ...g };
|
|
1412
1437
|
if ("targetId" in g) {
|
|
1413
|
-
const
|
|
1438
|
+
const O = y(J.targetId), R = ht(O == null ? void 0 : O.fieldType, O == null ? void 0 : O.displayFormat);
|
|
1414
1439
|
R.includes(J.operator) || (J.operator = R[0] || "equals");
|
|
1415
|
-
const D = Array.isArray(
|
|
1440
|
+
const D = Array.isArray(O == null ? void 0 : O.options) ? O.options.map(pt) : [];
|
|
1416
1441
|
D.length > 0 && (new Set(D.map((se) => se.id)).has(J.value) || (J.value = ""));
|
|
1417
1442
|
}
|
|
1418
|
-
|
|
1443
|
+
V[v] = J, S({ ...p, conditions: V });
|
|
1419
1444
|
},
|
|
1420
1445
|
[p, y, S]
|
|
1421
1446
|
), U = m.useMemo(
|
|
1422
|
-
() =>
|
|
1423
|
-
[
|
|
1447
|
+
() => I.filter((v) => v.id !== j),
|
|
1448
|
+
[I, j]
|
|
1424
1449
|
), k = !E || !j;
|
|
1425
1450
|
return /* @__PURE__ */ t.jsxs("div", { className: "logic-editor-container space-y-4", children: [
|
|
1426
1451
|
f && /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
|
|
@@ -1430,12 +1455,12 @@ function $r() {
|
|
|
1430
1455
|
{
|
|
1431
1456
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none bg-white",
|
|
1432
1457
|
value: i,
|
|
1433
|
-
onChange: (
|
|
1458
|
+
onChange: (v) => A(v.target.value),
|
|
1434
1459
|
children: [
|
|
1435
1460
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "Section (this)" }),
|
|
1436
|
-
u.map((
|
|
1461
|
+
u.map((v) => {
|
|
1437
1462
|
var g, w;
|
|
1438
|
-
return /* @__PURE__ */ t.jsx("option", { value: `child:${
|
|
1463
|
+
return /* @__PURE__ */ t.jsx("option", { value: `child:${v.id}`, children: ((g = v.question) == null ? void 0 : g.trim()) || ((w = v.title) == null ? void 0 : w.trim()) || v.id }, v.id);
|
|
1439
1464
|
})
|
|
1440
1465
|
]
|
|
1441
1466
|
}
|
|
@@ -1448,7 +1473,7 @@ function $r() {
|
|
|
1448
1473
|
"select",
|
|
1449
1474
|
{
|
|
1450
1475
|
value: p.logic || "AND",
|
|
1451
|
-
onChange: (
|
|
1476
|
+
onChange: (v) => S({ ...p, logic: v.target.value }),
|
|
1452
1477
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none bg-white",
|
|
1453
1478
|
disabled: k,
|
|
1454
1479
|
children: [
|
|
@@ -1487,8 +1512,8 @@ function $r() {
|
|
|
1487
1512
|
p.conditions.length,
|
|
1488
1513
|
")"
|
|
1489
1514
|
] }),
|
|
1490
|
-
/* @__PURE__ */ t.jsx("div", { className: "space-y-3", children: p.conditions.map((
|
|
1491
|
-
const w = y(
|
|
1515
|
+
/* @__PURE__ */ t.jsx("div", { className: "space-y-3", children: p.conditions.map((v, g) => {
|
|
1516
|
+
const w = y(v.targetId), V = ht(w == null ? void 0 : w.fieldType, w == null ? void 0 : w.displayFormat), M = Array.isArray(w == null ? void 0 : w.options) ? w.options.map(pt) : [], J = M.length > 0;
|
|
1492
1517
|
return /* @__PURE__ */ t.jsxs("div", { className: "p-3 bg-gray-50 border border-gray-200 rounded-lg space-y-2", children: [
|
|
1493
1518
|
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
|
|
1494
1519
|
/* @__PURE__ */ t.jsxs("span", { className: "text-xs font-semibold text-gray-500 uppercase tracking-wide", children: [
|
|
@@ -1499,7 +1524,7 @@ function $r() {
|
|
|
1499
1524
|
"button",
|
|
1500
1525
|
{
|
|
1501
1526
|
type: "button",
|
|
1502
|
-
onClick: () =>
|
|
1527
|
+
onClick: () => q(g),
|
|
1503
1528
|
className: "text-gray-400 hover:text-red-600 transition-colors",
|
|
1504
1529
|
title: "Remove condition",
|
|
1505
1530
|
disabled: k,
|
|
@@ -1514,12 +1539,12 @@ function $r() {
|
|
|
1514
1539
|
"select",
|
|
1515
1540
|
{
|
|
1516
1541
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none bg-white text-sm",
|
|
1517
|
-
value:
|
|
1518
|
-
onChange: (
|
|
1542
|
+
value: v.targetId,
|
|
1543
|
+
onChange: (O) => B(g, { targetId: O.target.value }),
|
|
1519
1544
|
disabled: k,
|
|
1520
1545
|
children: [
|
|
1521
1546
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select field —" }),
|
|
1522
|
-
U.map((
|
|
1547
|
+
U.map((O) => /* @__PURE__ */ t.jsx("option", { value: O.id, children: O.label }, O.id))
|
|
1523
1548
|
]
|
|
1524
1549
|
}
|
|
1525
1550
|
)
|
|
@@ -1531,10 +1556,10 @@ function $r() {
|
|
|
1531
1556
|
"select",
|
|
1532
1557
|
{
|
|
1533
1558
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none bg-white text-sm",
|
|
1534
|
-
value:
|
|
1535
|
-
onChange: (
|
|
1559
|
+
value: v.operator,
|
|
1560
|
+
onChange: (O) => B(g, { operator: O.target.value }),
|
|
1536
1561
|
disabled: k || !w,
|
|
1537
|
-
children: (w ?
|
|
1562
|
+
children: (w ? V : ["equals"]).map((O) => /* @__PURE__ */ t.jsx("option", { value: O, children: Wr(O) }, O))
|
|
1538
1563
|
}
|
|
1539
1564
|
)
|
|
1540
1565
|
] }),
|
|
@@ -1544,12 +1569,12 @@ function $r() {
|
|
|
1544
1569
|
"select",
|
|
1545
1570
|
{
|
|
1546
1571
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none bg-white text-sm",
|
|
1547
|
-
value:
|
|
1548
|
-
onChange: (
|
|
1572
|
+
value: v.value,
|
|
1573
|
+
onChange: (O) => B(g, { value: O.target.value }),
|
|
1549
1574
|
disabled: k || !w,
|
|
1550
1575
|
children: [
|
|
1551
1576
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select option —" }),
|
|
1552
|
-
|
|
1577
|
+
M.map((O) => /* @__PURE__ */ t.jsx("option", { value: O.id, children: O.value }, O.id))
|
|
1553
1578
|
]
|
|
1554
1579
|
}
|
|
1555
1580
|
) : /* @__PURE__ */ t.jsx(
|
|
@@ -1557,8 +1582,8 @@ function $r() {
|
|
|
1557
1582
|
{
|
|
1558
1583
|
className: "w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none text-sm",
|
|
1559
1584
|
placeholder: "Enter value",
|
|
1560
|
-
value:
|
|
1561
|
-
onChange: (
|
|
1585
|
+
value: v.value,
|
|
1586
|
+
onChange: (O) => B(g, { value: O.target.value }),
|
|
1562
1587
|
disabled: k || !w
|
|
1563
1588
|
}
|
|
1564
1589
|
)
|
|
@@ -1571,19 +1596,19 @@ function $r() {
|
|
|
1571
1596
|
] });
|
|
1572
1597
|
}
|
|
1573
1598
|
function gt() {
|
|
1574
|
-
const e =
|
|
1599
|
+
const e = oe(), r = re(
|
|
1575
1600
|
m.useCallback(
|
|
1576
1601
|
(f) => e.selectedFieldId.value ? f.byId[e.selectedFieldId.value] : null,
|
|
1577
1602
|
[e.selectedFieldId.value]
|
|
1578
1603
|
)
|
|
1579
|
-
), [s,
|
|
1604
|
+
), [s, a] = m.useState("EDIT"), o = m.useCallback(
|
|
1580
1605
|
(f, u) => {
|
|
1581
1606
|
e.selectedChildId.set(f, u);
|
|
1582
1607
|
},
|
|
1583
1608
|
[e.selectedChildId.set]
|
|
1584
1609
|
);
|
|
1585
1610
|
if (m.useEffect(() => {
|
|
1586
|
-
e.selectedChildId.set(null, null),
|
|
1611
|
+
e.selectedChildId.set(null, null), a("EDIT");
|
|
1587
1612
|
}, [e.selectedFieldId.value]), e.state.isPreview) return null;
|
|
1588
1613
|
const l = !r, c = (r == null ? void 0 : r.fieldType) === "section";
|
|
1589
1614
|
return /* @__PURE__ */ t.jsxs(
|
|
@@ -1596,10 +1621,10 @@ function gt() {
|
|
|
1596
1621
|
"button",
|
|
1597
1622
|
{
|
|
1598
1623
|
type: "button",
|
|
1599
|
-
onClick: () =>
|
|
1624
|
+
onClick: () => a("EDIT"),
|
|
1600
1625
|
className: `flex-1 flex items-center justify-center gap-2 px-3 py-2 rounded-lg text-xs font-medium transition-colors ${s === "EDIT" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
1601
1626
|
children: [
|
|
1602
|
-
/* @__PURE__ */ t.jsx(
|
|
1627
|
+
/* @__PURE__ */ t.jsx(Er, { className: "w-4 h-4" }),
|
|
1603
1628
|
/* @__PURE__ */ t.jsx("span", { children: "Edit" })
|
|
1604
1629
|
]
|
|
1605
1630
|
}
|
|
@@ -1608,10 +1633,10 @@ function gt() {
|
|
|
1608
1633
|
"button",
|
|
1609
1634
|
{
|
|
1610
1635
|
type: "button",
|
|
1611
|
-
onClick: () =>
|
|
1636
|
+
onClick: () => a("LOGIC"),
|
|
1612
1637
|
className: `flex-1 flex items-center justify-center gap-2 px-3 py-2 rounded-lg text-xs font-medium transition-colors ${s === "LOGIC" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
1613
1638
|
children: [
|
|
1614
|
-
/* @__PURE__ */ t.jsx(
|
|
1639
|
+
/* @__PURE__ */ t.jsx(Nr, { className: "w-4 h-4" }),
|
|
1615
1640
|
/* @__PURE__ */ t.jsx("span", { children: "Logic" })
|
|
1616
1641
|
]
|
|
1617
1642
|
}
|
|
@@ -1620,56 +1645,56 @@ function gt() {
|
|
|
1620
1645
|
/* @__PURE__ */ t.jsxs("div", { className: "p-4", children: [
|
|
1621
1646
|
l && /* @__PURE__ */ t.jsx("div", { className: "edit-panel-empty text-gray-600", children: /* @__PURE__ */ t.jsx("p", { children: "Select a field in the center panel to edit its properties." }) }),
|
|
1622
1647
|
!l && s === "EDIT" && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1623
|
-
!c && /* @__PURE__ */ t.jsx(
|
|
1648
|
+
!c && /* @__PURE__ */ t.jsx($r, { f: r }),
|
|
1624
1649
|
c && /* @__PURE__ */ t.jsx(
|
|
1625
|
-
|
|
1650
|
+
qr,
|
|
1626
1651
|
{
|
|
1627
1652
|
section: r,
|
|
1628
|
-
onActiveChildChange:
|
|
1653
|
+
onActiveChildChange: o
|
|
1629
1654
|
}
|
|
1630
1655
|
)
|
|
1631
1656
|
] }),
|
|
1632
|
-
!l && s === "LOGIC" && /* @__PURE__ */ t.jsx(
|
|
1657
|
+
!l && s === "LOGIC" && /* @__PURE__ */ t.jsx(Ur, {})
|
|
1633
1658
|
] })
|
|
1634
1659
|
]
|
|
1635
1660
|
}
|
|
1636
1661
|
);
|
|
1637
1662
|
}
|
|
1638
|
-
function
|
|
1639
|
-
const e =
|
|
1663
|
+
function Vr() {
|
|
1664
|
+
const e = oe(), { fields: r } = Or(e.state.isPreview), s = Ir((f) => f.hideUnsupportedFields), a = re((f) => f.order), o = m.useRef(null), l = m.useRef(0), c = Ye(() => (s ? r.filter((u) => u.fieldType !== "unsupported") : r).map((u) => u.id), [r, s]);
|
|
1640
1665
|
return m.useEffect(() => {
|
|
1641
1666
|
var f;
|
|
1642
1667
|
if (!e.state.isPreview) {
|
|
1643
|
-
if (
|
|
1644
|
-
const u =
|
|
1668
|
+
if (a.length > l.current) {
|
|
1669
|
+
const u = a[a.length - 1], h = (f = o.current) == null ? void 0 : f.querySelector(`[data-field-id="${u}"]`);
|
|
1645
1670
|
h && (h.scrollIntoView({ behavior: "smooth", block: "nearest" }), e.selectedFieldId.set(u));
|
|
1646
1671
|
}
|
|
1647
|
-
l.current =
|
|
1672
|
+
l.current = a.length;
|
|
1648
1673
|
}
|
|
1649
|
-
}, [
|
|
1674
|
+
}, [a, e.selectedFieldId, e.state.isPreview]), /* @__PURE__ */ t.jsx(
|
|
1650
1675
|
"div",
|
|
1651
1676
|
{
|
|
1652
|
-
ref:
|
|
1677
|
+
ref: o,
|
|
1653
1678
|
className: `form-builder-main
|
|
1654
1679
|
${e.state.isPreview ? "max-w-4xl" : "max-w-xl"}
|
|
1655
1680
|
mx-auto rounded-lg overflow-y-auto max-h-[calc(100svh-13rem)] lg:max-h-[calc(100dvh-11rem)] custom-scrollbar lg:pr-2`,
|
|
1656
1681
|
onClick: () => !e.state.isPreview && e.selectedFieldId.clear(),
|
|
1657
|
-
children: c.length === 0 ? /* @__PURE__ */ t.jsx(
|
|
1682
|
+
children: c.length === 0 ? /* @__PURE__ */ t.jsx(Yr, {}) : c.map((f) => /* @__PURE__ */ t.jsx(zr, { id: f }, f))
|
|
1658
1683
|
}
|
|
1659
1684
|
);
|
|
1660
1685
|
}
|
|
1661
|
-
const
|
|
1662
|
-
const s = re(m.useCallback((
|
|
1686
|
+
const zr = m.memo(function({ id: r }) {
|
|
1687
|
+
const s = re(m.useCallback((o) => o.byId[r], [r]));
|
|
1663
1688
|
if (!s) return null;
|
|
1664
|
-
const
|
|
1665
|
-
return
|
|
1689
|
+
const a = Sr(s.fieldType);
|
|
1690
|
+
return a ? /* @__PURE__ */ t.jsx("div", { className: "mb-1.5", "data-field-type": s.fieldType, "data-field-id": s.id, children: /* @__PURE__ */ t.jsx(a, { field: s }) }) : null;
|
|
1666
1691
|
});
|
|
1667
|
-
function
|
|
1692
|
+
function Yr() {
|
|
1668
1693
|
return /* @__PURE__ */ t.jsxs(
|
|
1669
1694
|
"div",
|
|
1670
1695
|
{
|
|
1671
1696
|
className: `form-builder-empty-state flex flex-col\r
|
|
1672
|
-
items-center justify-center h-72 bg-
|
|
1697
|
+
items-center justify-center h-72 bg-linear-to-br from-gray-50 \r
|
|
1673
1698
|
to-gray-100 border-2 border-dashed border-blue-200 rounded-xl \r
|
|
1674
1699
|
shadow-md text-center px-8 py-10`,
|
|
1675
1700
|
children: [
|
|
@@ -1696,106 +1721,106 @@ function Ur() {
|
|
|
1696
1721
|
}
|
|
1697
1722
|
function bt(e, r) {
|
|
1698
1723
|
(r == null || r > e.length) && (r = e.length);
|
|
1699
|
-
for (var s = 0,
|
|
1700
|
-
return
|
|
1724
|
+
for (var s = 0, a = Array(r); s < r; s++) a[s] = e[s];
|
|
1725
|
+
return a;
|
|
1701
1726
|
}
|
|
1702
|
-
function
|
|
1727
|
+
function Jr(e) {
|
|
1703
1728
|
if (Array.isArray(e)) return e;
|
|
1704
1729
|
}
|
|
1705
|
-
function
|
|
1706
|
-
return (r =
|
|
1730
|
+
function Br(e, r, s) {
|
|
1731
|
+
return (r = en(r)) in e ? Object.defineProperty(e, r, {
|
|
1707
1732
|
value: s,
|
|
1708
1733
|
enumerable: !0,
|
|
1709
1734
|
configurable: !0,
|
|
1710
1735
|
writable: !0
|
|
1711
1736
|
}) : e[r] = s, e;
|
|
1712
1737
|
}
|
|
1713
|
-
function
|
|
1738
|
+
function Hr(e, r) {
|
|
1714
1739
|
var s = e == null ? null : typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
|
|
1715
1740
|
if (s != null) {
|
|
1716
|
-
var
|
|
1741
|
+
var a, o, l, c, f = [], u = !0, h = !1;
|
|
1717
1742
|
try {
|
|
1718
|
-
if (l = (s = s.call(e)).next, r !== 0) for (; !(u = (
|
|
1719
|
-
} catch (
|
|
1720
|
-
h = !0,
|
|
1743
|
+
if (l = (s = s.call(e)).next, r !== 0) for (; !(u = (a = l.call(s)).done) && (f.push(a.value), f.length !== r); u = !0) ;
|
|
1744
|
+
} catch (x) {
|
|
1745
|
+
h = !0, o = x;
|
|
1721
1746
|
} finally {
|
|
1722
1747
|
try {
|
|
1723
1748
|
if (!u && s.return != null && (c = s.return(), Object(c) !== c)) return;
|
|
1724
1749
|
} finally {
|
|
1725
|
-
if (h) throw
|
|
1750
|
+
if (h) throw o;
|
|
1726
1751
|
}
|
|
1727
1752
|
}
|
|
1728
1753
|
return f;
|
|
1729
1754
|
}
|
|
1730
1755
|
}
|
|
1731
|
-
function
|
|
1756
|
+
function Kr() {
|
|
1732
1757
|
throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
1733
1758
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
|
|
1734
1759
|
}
|
|
1735
|
-
function
|
|
1760
|
+
function vt(e, r) {
|
|
1736
1761
|
var s = Object.keys(e);
|
|
1737
1762
|
if (Object.getOwnPropertySymbols) {
|
|
1738
|
-
var
|
|
1739
|
-
r && (
|
|
1740
|
-
return Object.getOwnPropertyDescriptor(e,
|
|
1741
|
-
})), s.push.apply(s,
|
|
1763
|
+
var a = Object.getOwnPropertySymbols(e);
|
|
1764
|
+
r && (a = a.filter(function(o) {
|
|
1765
|
+
return Object.getOwnPropertyDescriptor(e, o).enumerable;
|
|
1766
|
+
})), s.push.apply(s, a);
|
|
1742
1767
|
}
|
|
1743
1768
|
return s;
|
|
1744
1769
|
}
|
|
1745
|
-
function
|
|
1770
|
+
function xt(e) {
|
|
1746
1771
|
for (var r = 1; r < arguments.length; r++) {
|
|
1747
1772
|
var s = arguments[r] != null ? arguments[r] : {};
|
|
1748
|
-
r % 2 ?
|
|
1749
|
-
|
|
1750
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) :
|
|
1751
|
-
Object.defineProperty(e,
|
|
1773
|
+
r % 2 ? vt(Object(s), !0).forEach(function(a) {
|
|
1774
|
+
Br(e, a, s[a]);
|
|
1775
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) : vt(Object(s)).forEach(function(a) {
|
|
1776
|
+
Object.defineProperty(e, a, Object.getOwnPropertyDescriptor(s, a));
|
|
1752
1777
|
});
|
|
1753
1778
|
}
|
|
1754
1779
|
return e;
|
|
1755
1780
|
}
|
|
1756
|
-
function
|
|
1781
|
+
function Gr(e, r) {
|
|
1757
1782
|
if (e == null) return {};
|
|
1758
|
-
var s,
|
|
1783
|
+
var s, a, o = Xr(e, r);
|
|
1759
1784
|
if (Object.getOwnPropertySymbols) {
|
|
1760
1785
|
var l = Object.getOwnPropertySymbols(e);
|
|
1761
|
-
for (
|
|
1786
|
+
for (a = 0; a < l.length; a++) s = l[a], r.indexOf(s) === -1 && {}.propertyIsEnumerable.call(e, s) && (o[s] = e[s]);
|
|
1762
1787
|
}
|
|
1763
|
-
return
|
|
1788
|
+
return o;
|
|
1764
1789
|
}
|
|
1765
|
-
function
|
|
1790
|
+
function Xr(e, r) {
|
|
1766
1791
|
if (e == null) return {};
|
|
1767
1792
|
var s = {};
|
|
1768
|
-
for (var
|
|
1769
|
-
if (r.indexOf(
|
|
1770
|
-
s[
|
|
1793
|
+
for (var a in e) if ({}.hasOwnProperty.call(e, a)) {
|
|
1794
|
+
if (r.indexOf(a) !== -1) continue;
|
|
1795
|
+
s[a] = e[a];
|
|
1771
1796
|
}
|
|
1772
1797
|
return s;
|
|
1773
1798
|
}
|
|
1774
|
-
function
|
|
1775
|
-
return
|
|
1799
|
+
function Qr(e, r) {
|
|
1800
|
+
return Jr(e) || Hr(e, r) || tn(e, r) || Kr();
|
|
1776
1801
|
}
|
|
1777
|
-
function
|
|
1802
|
+
function Zr(e, r) {
|
|
1778
1803
|
if (typeof e != "object" || !e) return e;
|
|
1779
1804
|
var s = e[Symbol.toPrimitive];
|
|
1780
1805
|
if (s !== void 0) {
|
|
1781
|
-
var
|
|
1782
|
-
if (typeof
|
|
1806
|
+
var a = s.call(e, r);
|
|
1807
|
+
if (typeof a != "object") return a;
|
|
1783
1808
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
1784
1809
|
}
|
|
1785
1810
|
return (r === "string" ? String : Number)(e);
|
|
1786
1811
|
}
|
|
1787
|
-
function
|
|
1788
|
-
var r =
|
|
1812
|
+
function en(e) {
|
|
1813
|
+
var r = Zr(e, "string");
|
|
1789
1814
|
return typeof r == "symbol" ? r : r + "";
|
|
1790
1815
|
}
|
|
1791
|
-
function
|
|
1816
|
+
function tn(e, r) {
|
|
1792
1817
|
if (e) {
|
|
1793
1818
|
if (typeof e == "string") return bt(e, r);
|
|
1794
1819
|
var s = {}.toString.call(e).slice(8, -1);
|
|
1795
1820
|
return s === "Object" && e.constructor && (s = e.constructor.name), s === "Map" || s === "Set" ? Array.from(e) : s === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(s) ? bt(e, r) : void 0;
|
|
1796
1821
|
}
|
|
1797
1822
|
}
|
|
1798
|
-
function
|
|
1823
|
+
function rn(e, r, s) {
|
|
1799
1824
|
return r in e ? Object.defineProperty(e, r, {
|
|
1800
1825
|
value: s,
|
|
1801
1826
|
enumerable: !0,
|
|
@@ -1806,76 +1831,76 @@ function Zr(e, r, s) {
|
|
|
1806
1831
|
function yt(e, r) {
|
|
1807
1832
|
var s = Object.keys(e);
|
|
1808
1833
|
if (Object.getOwnPropertySymbols) {
|
|
1809
|
-
var
|
|
1810
|
-
r && (
|
|
1811
|
-
return Object.getOwnPropertyDescriptor(e,
|
|
1812
|
-
})), s.push.apply(s,
|
|
1834
|
+
var a = Object.getOwnPropertySymbols(e);
|
|
1835
|
+
r && (a = a.filter(function(o) {
|
|
1836
|
+
return Object.getOwnPropertyDescriptor(e, o).enumerable;
|
|
1837
|
+
})), s.push.apply(s, a);
|
|
1813
1838
|
}
|
|
1814
1839
|
return s;
|
|
1815
1840
|
}
|
|
1816
1841
|
function jt(e) {
|
|
1817
1842
|
for (var r = 1; r < arguments.length; r++) {
|
|
1818
1843
|
var s = arguments[r] != null ? arguments[r] : {};
|
|
1819
|
-
r % 2 ? yt(Object(s), !0).forEach(function(
|
|
1820
|
-
|
|
1821
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) : yt(Object(s)).forEach(function(
|
|
1822
|
-
Object.defineProperty(e,
|
|
1844
|
+
r % 2 ? yt(Object(s), !0).forEach(function(a) {
|
|
1845
|
+
rn(e, a, s[a]);
|
|
1846
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) : yt(Object(s)).forEach(function(a) {
|
|
1847
|
+
Object.defineProperty(e, a, Object.getOwnPropertyDescriptor(s, a));
|
|
1823
1848
|
});
|
|
1824
1849
|
}
|
|
1825
1850
|
return e;
|
|
1826
1851
|
}
|
|
1827
|
-
function
|
|
1852
|
+
function nn() {
|
|
1828
1853
|
for (var e = arguments.length, r = new Array(e), s = 0; s < e; s++)
|
|
1829
1854
|
r[s] = arguments[s];
|
|
1830
|
-
return function(
|
|
1831
|
-
return r.reduceRight(function(
|
|
1832
|
-
return l(
|
|
1833
|
-
},
|
|
1855
|
+
return function(a) {
|
|
1856
|
+
return r.reduceRight(function(o, l) {
|
|
1857
|
+
return l(o);
|
|
1858
|
+
}, a);
|
|
1834
1859
|
};
|
|
1835
1860
|
}
|
|
1836
|
-
function
|
|
1861
|
+
function ve(e) {
|
|
1837
1862
|
return function r() {
|
|
1838
|
-
for (var s = this,
|
|
1839
|
-
|
|
1840
|
-
return
|
|
1863
|
+
for (var s = this, a = arguments.length, o = new Array(a), l = 0; l < a; l++)
|
|
1864
|
+
o[l] = arguments[l];
|
|
1865
|
+
return o.length >= e.length ? e.apply(this, o) : function() {
|
|
1841
1866
|
for (var c = arguments.length, f = new Array(c), u = 0; u < c; u++)
|
|
1842
1867
|
f[u] = arguments[u];
|
|
1843
|
-
return r.apply(s, [].concat(
|
|
1868
|
+
return r.apply(s, [].concat(o, f));
|
|
1844
1869
|
};
|
|
1845
1870
|
};
|
|
1846
1871
|
}
|
|
1847
1872
|
function Pe(e) {
|
|
1848
1873
|
return {}.toString.call(e).includes("Object");
|
|
1849
1874
|
}
|
|
1850
|
-
function
|
|
1875
|
+
function sn(e) {
|
|
1851
1876
|
return !Object.keys(e).length;
|
|
1852
1877
|
}
|
|
1853
1878
|
function je(e) {
|
|
1854
1879
|
return typeof e == "function";
|
|
1855
1880
|
}
|
|
1856
|
-
function
|
|
1881
|
+
function an(e, r) {
|
|
1857
1882
|
return Object.prototype.hasOwnProperty.call(e, r);
|
|
1858
1883
|
}
|
|
1859
|
-
function
|
|
1884
|
+
function on(e, r) {
|
|
1860
1885
|
return Pe(r) || le("changeType"), Object.keys(r).some(function(s) {
|
|
1861
|
-
return !
|
|
1886
|
+
return !an(e, s);
|
|
1862
1887
|
}) && le("changeField"), r;
|
|
1863
1888
|
}
|
|
1864
|
-
function
|
|
1889
|
+
function ln(e) {
|
|
1865
1890
|
je(e) || le("selectorType");
|
|
1866
1891
|
}
|
|
1867
|
-
function
|
|
1892
|
+
function cn(e) {
|
|
1868
1893
|
je(e) || Pe(e) || le("handlerType"), Pe(e) && Object.values(e).some(function(r) {
|
|
1869
1894
|
return !je(r);
|
|
1870
1895
|
}) && le("handlersType");
|
|
1871
1896
|
}
|
|
1872
|
-
function
|
|
1873
|
-
e || le("initialIsRequired"), Pe(e) || le("initialType"),
|
|
1897
|
+
function dn(e) {
|
|
1898
|
+
e || le("initialIsRequired"), Pe(e) || le("initialType"), sn(e) && le("initialContent");
|
|
1874
1899
|
}
|
|
1875
|
-
function
|
|
1900
|
+
function un(e, r) {
|
|
1876
1901
|
throw new Error(e[r] || e.default);
|
|
1877
1902
|
}
|
|
1878
|
-
var
|
|
1903
|
+
var fn = {
|
|
1879
1904
|
initialIsRequired: "initial state is required",
|
|
1880
1905
|
initialType: "initial state should be an object",
|
|
1881
1906
|
initialContent: "initial state shouldn't be an empty object",
|
|
@@ -1885,73 +1910,73 @@ var cn = {
|
|
|
1885
1910
|
changeType: "provided value of changes should be an object",
|
|
1886
1911
|
changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
|
|
1887
1912
|
default: "an unknown error accured in `state-local` package"
|
|
1888
|
-
}, le =
|
|
1889
|
-
changes:
|
|
1890
|
-
selector:
|
|
1891
|
-
handler:
|
|
1892
|
-
initial:
|
|
1913
|
+
}, le = ve(un)(fn), Se = {
|
|
1914
|
+
changes: on,
|
|
1915
|
+
selector: ln,
|
|
1916
|
+
handler: cn,
|
|
1917
|
+
initial: dn
|
|
1893
1918
|
};
|
|
1894
|
-
function
|
|
1919
|
+
function mn(e) {
|
|
1895
1920
|
var r = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
|
|
1896
|
-
|
|
1921
|
+
Se.initial(e), Se.handler(r);
|
|
1897
1922
|
var s = {
|
|
1898
1923
|
current: e
|
|
1899
|
-
},
|
|
1924
|
+
}, a = ve(gn)(s, r), o = ve(pn)(s), l = ve(Se.changes)(e), c = ve(hn)(s);
|
|
1900
1925
|
function f() {
|
|
1901
|
-
var h = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(
|
|
1902
|
-
return
|
|
1926
|
+
var h = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(x) {
|
|
1927
|
+
return x;
|
|
1903
1928
|
};
|
|
1904
|
-
return
|
|
1929
|
+
return Se.selector(h), h(s.current);
|
|
1905
1930
|
}
|
|
1906
1931
|
function u(h) {
|
|
1907
|
-
|
|
1932
|
+
nn(a, o, l, c)(h);
|
|
1908
1933
|
}
|
|
1909
1934
|
return [f, u];
|
|
1910
1935
|
}
|
|
1911
|
-
function
|
|
1936
|
+
function hn(e, r) {
|
|
1912
1937
|
return je(r) ? r(e.current) : r;
|
|
1913
1938
|
}
|
|
1914
|
-
function
|
|
1939
|
+
function pn(e, r) {
|
|
1915
1940
|
return e.current = jt(jt({}, e.current), r), r;
|
|
1916
1941
|
}
|
|
1917
|
-
function
|
|
1918
|
-
return je(r) ? r(e.current) : Object.keys(s).forEach(function(
|
|
1919
|
-
var
|
|
1920
|
-
return (
|
|
1942
|
+
function gn(e, r, s) {
|
|
1943
|
+
return je(r) ? r(e.current) : Object.keys(s).forEach(function(a) {
|
|
1944
|
+
var o;
|
|
1945
|
+
return (o = r[a]) === null || o === void 0 ? void 0 : o.call(r, e.current[a]);
|
|
1921
1946
|
}), s;
|
|
1922
1947
|
}
|
|
1923
|
-
var
|
|
1924
|
-
create:
|
|
1925
|
-
},
|
|
1948
|
+
var bn = {
|
|
1949
|
+
create: mn
|
|
1950
|
+
}, vn = {
|
|
1926
1951
|
paths: {
|
|
1927
1952
|
vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.54.0/min/vs"
|
|
1928
1953
|
}
|
|
1929
1954
|
};
|
|
1930
|
-
function
|
|
1955
|
+
function xn(e) {
|
|
1931
1956
|
return function r() {
|
|
1932
|
-
for (var s = this,
|
|
1933
|
-
|
|
1934
|
-
return
|
|
1957
|
+
for (var s = this, a = arguments.length, o = new Array(a), l = 0; l < a; l++)
|
|
1958
|
+
o[l] = arguments[l];
|
|
1959
|
+
return o.length >= e.length ? e.apply(this, o) : function() {
|
|
1935
1960
|
for (var c = arguments.length, f = new Array(c), u = 0; u < c; u++)
|
|
1936
1961
|
f[u] = arguments[u];
|
|
1937
|
-
return r.apply(s, [].concat(
|
|
1962
|
+
return r.apply(s, [].concat(o, f));
|
|
1938
1963
|
};
|
|
1939
1964
|
};
|
|
1940
1965
|
}
|
|
1941
|
-
function
|
|
1966
|
+
function yn(e) {
|
|
1942
1967
|
return {}.toString.call(e).includes("Object");
|
|
1943
1968
|
}
|
|
1944
|
-
function
|
|
1945
|
-
return e || wt("configIsRequired"),
|
|
1969
|
+
function jn(e) {
|
|
1970
|
+
return e || wt("configIsRequired"), yn(e) || wt("configType"), e.urls ? (wn(), {
|
|
1946
1971
|
paths: {
|
|
1947
1972
|
vs: e.urls.monacoBase
|
|
1948
1973
|
}
|
|
1949
1974
|
}) : e;
|
|
1950
1975
|
}
|
|
1951
|
-
function
|
|
1976
|
+
function wn() {
|
|
1952
1977
|
console.warn(Tt.deprecation);
|
|
1953
1978
|
}
|
|
1954
|
-
function
|
|
1979
|
+
function Cn(e, r) {
|
|
1955
1980
|
throw new Error(e[r] || e.default);
|
|
1956
1981
|
}
|
|
1957
1982
|
var Tt = {
|
|
@@ -1968,103 +1993,103 @@ var Tt = {
|
|
|
1968
1993
|
|
|
1969
1994
|
For more please check the link https://github.com/suren-atoyan/monaco-loader#config
|
|
1970
1995
|
`
|
|
1971
|
-
}, wt =
|
|
1972
|
-
config:
|
|
1973
|
-
},
|
|
1974
|
-
for (var r = arguments.length, s = new Array(r),
|
|
1975
|
-
s[
|
|
1976
|
-
return function(
|
|
1996
|
+
}, wt = xn(Cn)(Tt), En = {
|
|
1997
|
+
config: jn
|
|
1998
|
+
}, Nn = function() {
|
|
1999
|
+
for (var r = arguments.length, s = new Array(r), a = 0; a < r; a++)
|
|
2000
|
+
s[a] = arguments[a];
|
|
2001
|
+
return function(o) {
|
|
1977
2002
|
return s.reduceRight(function(l, c) {
|
|
1978
2003
|
return c(l);
|
|
1979
|
-
},
|
|
2004
|
+
}, o);
|
|
1980
2005
|
};
|
|
1981
2006
|
};
|
|
1982
2007
|
function kt(e, r) {
|
|
1983
2008
|
return Object.keys(r).forEach(function(s) {
|
|
1984
2009
|
r[s] instanceof Object && e[s] && Object.assign(r[s], kt(e[s], r[s]));
|
|
1985
|
-
}),
|
|
2010
|
+
}), xt(xt({}, e), r);
|
|
1986
2011
|
}
|
|
1987
|
-
var
|
|
2012
|
+
var On = {
|
|
1988
2013
|
type: "cancelation",
|
|
1989
2014
|
msg: "operation is manually canceled"
|
|
1990
2015
|
};
|
|
1991
2016
|
function Ue(e) {
|
|
1992
|
-
var r = !1, s = new Promise(function(
|
|
2017
|
+
var r = !1, s = new Promise(function(a, o) {
|
|
1993
2018
|
e.then(function(l) {
|
|
1994
|
-
return r ?
|
|
1995
|
-
}), e.catch(
|
|
2019
|
+
return r ? o(On) : a(l);
|
|
2020
|
+
}), e.catch(o);
|
|
1996
2021
|
});
|
|
1997
2022
|
return s.cancel = function() {
|
|
1998
2023
|
return r = !0;
|
|
1999
2024
|
}, s;
|
|
2000
2025
|
}
|
|
2001
|
-
var
|
|
2002
|
-
config:
|
|
2026
|
+
var In = ["monaco"], Sn = bn.create({
|
|
2027
|
+
config: vn,
|
|
2003
2028
|
isInitialized: !1,
|
|
2004
2029
|
resolve: null,
|
|
2005
2030
|
reject: null,
|
|
2006
2031
|
monaco: null
|
|
2007
|
-
}), Pt =
|
|
2008
|
-
function
|
|
2009
|
-
var r =
|
|
2010
|
-
_e(function(
|
|
2032
|
+
}), Pt = Qr(Sn, 2), we = Pt[0], _e = Pt[1];
|
|
2033
|
+
function Rn(e) {
|
|
2034
|
+
var r = En.config(e), s = r.monaco, a = Gr(r, In);
|
|
2035
|
+
_e(function(o) {
|
|
2011
2036
|
return {
|
|
2012
|
-
config: kt(
|
|
2037
|
+
config: kt(o.config, a),
|
|
2013
2038
|
monaco: s
|
|
2014
2039
|
};
|
|
2015
2040
|
});
|
|
2016
2041
|
}
|
|
2017
|
-
function
|
|
2042
|
+
function Tn() {
|
|
2018
2043
|
var e = we(function(r) {
|
|
2019
|
-
var s = r.monaco,
|
|
2044
|
+
var s = r.monaco, a = r.isInitialized, o = r.resolve;
|
|
2020
2045
|
return {
|
|
2021
2046
|
monaco: s,
|
|
2022
|
-
isInitialized:
|
|
2023
|
-
resolve:
|
|
2047
|
+
isInitialized: a,
|
|
2048
|
+
resolve: o
|
|
2024
2049
|
};
|
|
2025
2050
|
});
|
|
2026
2051
|
if (!e.isInitialized) {
|
|
2027
2052
|
if (_e({
|
|
2028
2053
|
isInitialized: !0
|
|
2029
2054
|
}), e.monaco)
|
|
2030
|
-
return e.resolve(e.monaco), Ue(
|
|
2055
|
+
return e.resolve(e.monaco), Ue(Ve);
|
|
2031
2056
|
if (window.monaco && window.monaco.editor)
|
|
2032
|
-
return _t(window.monaco), e.resolve(window.monaco), Ue(
|
|
2033
|
-
|
|
2057
|
+
return _t(window.monaco), e.resolve(window.monaco), Ue(Ve);
|
|
2058
|
+
Nn(kn, _n)(An);
|
|
2034
2059
|
}
|
|
2035
|
-
return Ue(
|
|
2060
|
+
return Ue(Ve);
|
|
2036
2061
|
}
|
|
2037
|
-
function
|
|
2062
|
+
function kn(e) {
|
|
2038
2063
|
return document.body.appendChild(e);
|
|
2039
2064
|
}
|
|
2040
|
-
function
|
|
2065
|
+
function Pn(e) {
|
|
2041
2066
|
var r = document.createElement("script");
|
|
2042
2067
|
return e && (r.src = e), r;
|
|
2043
2068
|
}
|
|
2044
|
-
function
|
|
2045
|
-
var r = we(function(
|
|
2046
|
-
var
|
|
2069
|
+
function _n(e) {
|
|
2070
|
+
var r = we(function(a) {
|
|
2071
|
+
var o = a.config, l = a.reject;
|
|
2047
2072
|
return {
|
|
2048
|
-
config:
|
|
2073
|
+
config: o,
|
|
2049
2074
|
reject: l
|
|
2050
2075
|
};
|
|
2051
|
-
}), s =
|
|
2076
|
+
}), s = Pn("".concat(r.config.paths.vs, "/loader.js"));
|
|
2052
2077
|
return s.onload = function() {
|
|
2053
2078
|
return e();
|
|
2054
2079
|
}, s.onerror = r.reject, s;
|
|
2055
2080
|
}
|
|
2056
|
-
function
|
|
2081
|
+
function An() {
|
|
2057
2082
|
var e = we(function(s) {
|
|
2058
|
-
var
|
|
2083
|
+
var a = s.config, o = s.resolve, l = s.reject;
|
|
2059
2084
|
return {
|
|
2060
|
-
config:
|
|
2061
|
-
resolve:
|
|
2085
|
+
config: a,
|
|
2086
|
+
resolve: o,
|
|
2062
2087
|
reject: l
|
|
2063
2088
|
};
|
|
2064
2089
|
}), r = window.require;
|
|
2065
2090
|
r.config(e.config), r(["vs/editor/editor.main"], function(s) {
|
|
2066
|
-
var
|
|
2067
|
-
_t(
|
|
2091
|
+
var a = s.m;
|
|
2092
|
+
_t(a), e.resolve(a);
|
|
2068
2093
|
}, function(s) {
|
|
2069
2094
|
e.reject(s);
|
|
2070
2095
|
});
|
|
@@ -2074,136 +2099,136 @@ function _t(e) {
|
|
|
2074
2099
|
monaco: e
|
|
2075
2100
|
});
|
|
2076
2101
|
}
|
|
2077
|
-
function
|
|
2102
|
+
function Mn() {
|
|
2078
2103
|
return we(function(e) {
|
|
2079
2104
|
var r = e.monaco;
|
|
2080
2105
|
return r;
|
|
2081
2106
|
});
|
|
2082
2107
|
}
|
|
2083
|
-
var
|
|
2108
|
+
var Ve = new Promise(function(e, r) {
|
|
2084
2109
|
return _e({
|
|
2085
2110
|
resolve: e,
|
|
2086
2111
|
reject: r
|
|
2087
2112
|
});
|
|
2088
2113
|
}), At = {
|
|
2089
|
-
config:
|
|
2090
|
-
init:
|
|
2091
|
-
__getMonacoInstance:
|
|
2092
|
-
},
|
|
2093
|
-
function
|
|
2094
|
-
return m.createElement("div", { style:
|
|
2095
|
-
}
|
|
2096
|
-
var
|
|
2097
|
-
function
|
|
2098
|
-
return m.createElement("section", { style: { ...ze.wrapper, width: e, height: r }, ...c }, !s && m.createElement(
|
|
2099
|
-
}
|
|
2100
|
-
var
|
|
2101
|
-
function
|
|
2102
|
-
|
|
2103
|
-
}
|
|
2104
|
-
var Ft =
|
|
2105
|
-
function
|
|
2106
|
-
let
|
|
2107
|
-
|
|
2108
|
-
|
|
2114
|
+
config: Rn,
|
|
2115
|
+
init: Tn,
|
|
2116
|
+
__getMonacoInstance: Mn
|
|
2117
|
+
}, Fn = { wrapper: { display: "flex", position: "relative", textAlign: "initial" }, fullWidth: { width: "100%" }, hide: { display: "none" } }, ze = Fn, Dn = { container: { display: "flex", height: "100%", width: "100%", justifyContent: "center", alignItems: "center" } }, Ln = Dn;
|
|
2118
|
+
function $n({ children: e }) {
|
|
2119
|
+
return m.createElement("div", { style: Ln.container }, e);
|
|
2120
|
+
}
|
|
2121
|
+
var qn = $n, Wn = qn;
|
|
2122
|
+
function Un({ width: e, height: r, isEditorReady: s, loading: a, _ref: o, className: l, wrapperProps: c }) {
|
|
2123
|
+
return m.createElement("section", { style: { ...ze.wrapper, width: e, height: r }, ...c }, !s && m.createElement(Wn, null, a), m.createElement("div", { ref: o, style: { ...ze.fullWidth, ...!s && ze.hide }, className: l }));
|
|
2124
|
+
}
|
|
2125
|
+
var Vn = Un, Mt = Be(Vn);
|
|
2126
|
+
function zn(e) {
|
|
2127
|
+
ae(e, []);
|
|
2128
|
+
}
|
|
2129
|
+
var Ft = zn;
|
|
2130
|
+
function Yn(e, r, s = !0) {
|
|
2131
|
+
let a = K(!0);
|
|
2132
|
+
ae(a.current || !s ? () => {
|
|
2133
|
+
a.current = !1;
|
|
2109
2134
|
} : e, r);
|
|
2110
2135
|
}
|
|
2111
|
-
var Z =
|
|
2112
|
-
function
|
|
2136
|
+
var Z = Yn;
|
|
2137
|
+
function xe() {
|
|
2113
2138
|
}
|
|
2114
|
-
function me(e, r, s,
|
|
2115
|
-
return
|
|
2139
|
+
function me(e, r, s, a) {
|
|
2140
|
+
return Jn(e, a) || Bn(e, r, s, a);
|
|
2116
2141
|
}
|
|
2117
|
-
function
|
|
2142
|
+
function Jn(e, r) {
|
|
2118
2143
|
return e.editor.getModel(Dt(e, r));
|
|
2119
2144
|
}
|
|
2120
|
-
function
|
|
2121
|
-
return e.editor.createModel(r, s,
|
|
2145
|
+
function Bn(e, r, s, a) {
|
|
2146
|
+
return e.editor.createModel(r, s, a ? Dt(e, a) : void 0);
|
|
2122
2147
|
}
|
|
2123
2148
|
function Dt(e, r) {
|
|
2124
2149
|
return e.Uri.parse(r);
|
|
2125
2150
|
}
|
|
2126
|
-
function
|
|
2127
|
-
let [y, S] = ke(!1), [p, N] = ke(!0), L = K(null),
|
|
2151
|
+
function Hn({ original: e, modified: r, language: s, originalLanguage: a, modifiedLanguage: o, originalModelPath: l, modifiedModelPath: c, keepCurrentOriginalModel: f = !1, keepCurrentModifiedModel: u = !1, theme: h = "light", loading: x = "Loading...", options: i = {}, height: A = "100%", width: T = "100%", className: W, wrapperProps: j = {}, beforeMount: E = xe, onMount: I = xe }) {
|
|
2152
|
+
let [y, S] = ke(!1), [p, N] = ke(!0), L = K(null), q = K(null), B = K(null), U = K(I), k = K(E), te = K(!1);
|
|
2128
2153
|
Ft(() => {
|
|
2129
2154
|
let g = At.init();
|
|
2130
|
-
return g.then((w) => (
|
|
2155
|
+
return g.then((w) => (q.current = w) && N(!1)).catch((w) => (w == null ? void 0 : w.type) !== "cancelation" && console.error("Monaco initialization: error:", w)), () => L.current ? v() : g.cancel();
|
|
2131
2156
|
}), Z(() => {
|
|
2132
|
-
if (L.current &&
|
|
2133
|
-
let g = L.current.getOriginalEditor(), w = me(
|
|
2157
|
+
if (L.current && q.current) {
|
|
2158
|
+
let g = L.current.getOriginalEditor(), w = me(q.current, e || "", a || s || "text", l || "");
|
|
2134
2159
|
w !== g.getModel() && g.setModel(w);
|
|
2135
2160
|
}
|
|
2136
2161
|
}, [l], y), Z(() => {
|
|
2137
|
-
if (L.current &&
|
|
2138
|
-
let g = L.current.getModifiedEditor(), w = me(
|
|
2162
|
+
if (L.current && q.current) {
|
|
2163
|
+
let g = L.current.getModifiedEditor(), w = me(q.current, r || "", o || s || "text", c || "");
|
|
2139
2164
|
w !== g.getModel() && g.setModel(w);
|
|
2140
2165
|
}
|
|
2141
2166
|
}, [c], y), Z(() => {
|
|
2142
2167
|
let g = L.current.getModifiedEditor();
|
|
2143
|
-
g.getOption(
|
|
2168
|
+
g.getOption(q.current.editor.EditorOption.readOnly) ? g.setValue(r || "") : r !== g.getValue() && (g.executeEdits("", [{ range: g.getModel().getFullModelRange(), text: r || "", forceMoveMarkers: !0 }]), g.pushUndoStop());
|
|
2144
2169
|
}, [r], y), Z(() => {
|
|
2145
2170
|
var g, w;
|
|
2146
2171
|
(w = (g = L.current) == null ? void 0 : g.getModel()) == null || w.original.setValue(e || "");
|
|
2147
2172
|
}, [e], y), Z(() => {
|
|
2148
2173
|
let { original: g, modified: w } = L.current.getModel();
|
|
2149
|
-
|
|
2150
|
-
}, [s,
|
|
2174
|
+
q.current.editor.setModelLanguage(g, a || s || "text"), q.current.editor.setModelLanguage(w, o || s || "text");
|
|
2175
|
+
}, [s, a, o], y), Z(() => {
|
|
2151
2176
|
var g;
|
|
2152
|
-
(g =
|
|
2177
|
+
(g = q.current) == null || g.editor.setTheme(h);
|
|
2153
2178
|
}, [h], y), Z(() => {
|
|
2154
2179
|
var g;
|
|
2155
2180
|
(g = L.current) == null || g.updateOptions(i);
|
|
2156
2181
|
}, [i], y);
|
|
2157
2182
|
let ne = Te(() => {
|
|
2158
|
-
var
|
|
2159
|
-
if (!
|
|
2160
|
-
k.current(
|
|
2161
|
-
let g = me(
|
|
2162
|
-
(
|
|
2163
|
-
}, [s, r,
|
|
2183
|
+
var V;
|
|
2184
|
+
if (!q.current) return;
|
|
2185
|
+
k.current(q.current);
|
|
2186
|
+
let g = me(q.current, e || "", a || s || "text", l || ""), w = me(q.current, r || "", o || s || "text", c || "");
|
|
2187
|
+
(V = L.current) == null || V.setModel({ original: g, modified: w });
|
|
2188
|
+
}, [s, r, o, e, a, l, c]), G = Te(() => {
|
|
2164
2189
|
var g;
|
|
2165
|
-
!te.current && B.current && (L.current =
|
|
2190
|
+
!te.current && B.current && (L.current = q.current.editor.createDiffEditor(B.current, { automaticLayout: !0, ...i }), ne(), (g = q.current) == null || g.editor.setTheme(h), S(!0), te.current = !0);
|
|
2166
2191
|
}, [i, h, ne]);
|
|
2167
|
-
|
|
2168
|
-
y && U.current(L.current,
|
|
2169
|
-
}, [y]),
|
|
2192
|
+
ae(() => {
|
|
2193
|
+
y && U.current(L.current, q.current);
|
|
2194
|
+
}, [y]), ae(() => {
|
|
2170
2195
|
!p && !y && G();
|
|
2171
2196
|
}, [p, y, G]);
|
|
2172
|
-
function
|
|
2173
|
-
var w,
|
|
2197
|
+
function v() {
|
|
2198
|
+
var w, V, M, J;
|
|
2174
2199
|
let g = (w = L.current) == null ? void 0 : w.getModel();
|
|
2175
|
-
f || ((
|
|
2200
|
+
f || ((V = g == null ? void 0 : g.original) == null || V.dispose()), u || ((M = g == null ? void 0 : g.modified) == null || M.dispose()), (J = L.current) == null || J.dispose();
|
|
2176
2201
|
}
|
|
2177
|
-
return m.createElement(Mt, { width: T, height: A, isEditorReady: y, loading:
|
|
2202
|
+
return m.createElement(Mt, { width: T, height: A, isEditorReady: y, loading: x, _ref: B, className: W, wrapperProps: j });
|
|
2178
2203
|
}
|
|
2179
|
-
var
|
|
2180
|
-
Be(
|
|
2181
|
-
function
|
|
2204
|
+
var Kn = Hn;
|
|
2205
|
+
Be(Kn);
|
|
2206
|
+
function Gn(e) {
|
|
2182
2207
|
let r = K();
|
|
2183
|
-
return
|
|
2208
|
+
return ae(() => {
|
|
2184
2209
|
r.current = e;
|
|
2185
2210
|
}, [e]), r.current;
|
|
2186
2211
|
}
|
|
2187
|
-
var
|
|
2188
|
-
function
|
|
2189
|
-
let [N, L] = ke(!1), [
|
|
2212
|
+
var Xn = Gn, Re = /* @__PURE__ */ new Map();
|
|
2213
|
+
function Qn({ defaultValue: e, defaultLanguage: r, defaultPath: s, value: a, language: o, path: l, theme: c = "light", line: f, loading: u = "Loading...", options: h = {}, overrideServices: x = {}, saveViewState: i = !0, keepCurrentModel: A = !1, width: T = "100%", height: W = "100%", className: j, wrapperProps: E = {}, beforeMount: I = xe, onMount: y = xe, onChange: S, onValidate: p = xe }) {
|
|
2214
|
+
let [N, L] = ke(!1), [q, B] = ke(!0), U = K(null), k = K(null), te = K(null), ne = K(y), G = K(I), v = K(), g = K(a), w = Xn(l), V = K(!1), M = K(!1);
|
|
2190
2215
|
Ft(() => {
|
|
2191
2216
|
let R = At.init();
|
|
2192
|
-
return R.then((D) => (U.current = D) && B(!1)).catch((D) => (D == null ? void 0 : D.type) !== "cancelation" && console.error("Monaco initialization: error:", D)), () => k.current ?
|
|
2217
|
+
return R.then((D) => (U.current = D) && B(!1)).catch((D) => (D == null ? void 0 : D.type) !== "cancelation" && console.error("Monaco initialization: error:", D)), () => k.current ? O() : R.cancel();
|
|
2193
2218
|
}), Z(() => {
|
|
2194
2219
|
var D, H, se, ie;
|
|
2195
|
-
let R = me(U.current, e ||
|
|
2220
|
+
let R = me(U.current, e || a || "", r || o || "", l || s || "");
|
|
2196
2221
|
R !== ((D = k.current) == null ? void 0 : D.getModel()) && (i && Re.set(w, (H = k.current) == null ? void 0 : H.saveViewState()), (se = k.current) == null || se.setModel(R), i && ((ie = k.current) == null || ie.restoreViewState(Re.get(l))));
|
|
2197
2222
|
}, [l], N), Z(() => {
|
|
2198
2223
|
var R;
|
|
2199
2224
|
(R = k.current) == null || R.updateOptions(h);
|
|
2200
2225
|
}, [h], N), Z(() => {
|
|
2201
|
-
!k.current ||
|
|
2202
|
-
}, [
|
|
2226
|
+
!k.current || a === void 0 || (k.current.getOption(U.current.editor.EditorOption.readOnly) ? k.current.setValue(a) : a !== k.current.getValue() && (M.current = !0, k.current.executeEdits("", [{ range: k.current.getModel().getFullModelRange(), text: a, forceMoveMarkers: !0 }]), k.current.pushUndoStop(), M.current = !1));
|
|
2227
|
+
}, [a], N), Z(() => {
|
|
2203
2228
|
var D, H;
|
|
2204
2229
|
let R = (D = k.current) == null ? void 0 : D.getModel();
|
|
2205
|
-
R &&
|
|
2206
|
-
}, [
|
|
2230
|
+
R && o && ((H = U.current) == null || H.editor.setModelLanguage(R, o));
|
|
2231
|
+
}, [o], N), Z(() => {
|
|
2207
2232
|
var R;
|
|
2208
2233
|
f !== void 0 && ((R = k.current) == null || R.revealLine(f));
|
|
2209
2234
|
}, [f], N), Z(() => {
|
|
@@ -2212,22 +2237,22 @@ function Kn({ defaultValue: e, defaultLanguage: r, defaultPath: s, value: o, lan
|
|
|
2212
2237
|
}, [c], N);
|
|
2213
2238
|
let J = Te(() => {
|
|
2214
2239
|
var R;
|
|
2215
|
-
if (!(!te.current || !U.current) && !
|
|
2240
|
+
if (!(!te.current || !U.current) && !V.current) {
|
|
2216
2241
|
G.current(U.current);
|
|
2217
|
-
let D = l || s, H = me(U.current,
|
|
2218
|
-
k.current = (R = U.current) == null ? void 0 : R.editor.create(te.current, { model: H, automaticLayout: !0, ...h },
|
|
2242
|
+
let D = l || s, H = me(U.current, a || e || "", r || o || "", D || "");
|
|
2243
|
+
k.current = (R = U.current) == null ? void 0 : R.editor.create(te.current, { model: H, automaticLayout: !0, ...h }, x), i && k.current.restoreViewState(Re.get(D)), U.current.editor.setTheme(c), f !== void 0 && k.current.revealLine(f), L(!0), V.current = !0;
|
|
2219
2244
|
}
|
|
2220
|
-
}, [e, r, s,
|
|
2221
|
-
|
|
2245
|
+
}, [e, r, s, a, o, l, h, x, i, c, f]);
|
|
2246
|
+
ae(() => {
|
|
2222
2247
|
N && ne.current(k.current, U.current);
|
|
2223
|
-
}, [N]),
|
|
2224
|
-
!
|
|
2225
|
-
}, [
|
|
2248
|
+
}, [N]), ae(() => {
|
|
2249
|
+
!q && !N && J();
|
|
2250
|
+
}, [q, N, J]), g.current = a, ae(() => {
|
|
2226
2251
|
var R, D;
|
|
2227
|
-
N && S && ((R =
|
|
2228
|
-
|
|
2252
|
+
N && S && ((R = v.current) == null || R.dispose(), v.current = (D = k.current) == null ? void 0 : D.onDidChangeModelContent((H) => {
|
|
2253
|
+
M.current || S(k.current.getValue(), H);
|
|
2229
2254
|
}));
|
|
2230
|
-
}, [N, S]),
|
|
2255
|
+
}, [N, S]), ae(() => {
|
|
2231
2256
|
if (N) {
|
|
2232
2257
|
let R = U.current.editor.onDidChangeMarkers((D) => {
|
|
2233
2258
|
var se;
|
|
@@ -2244,79 +2269,79 @@ function Kn({ defaultValue: e, defaultLanguage: r, defaultPath: s, value: o, lan
|
|
|
2244
2269
|
return () => {
|
|
2245
2270
|
};
|
|
2246
2271
|
}, [N, p]);
|
|
2247
|
-
function
|
|
2272
|
+
function O() {
|
|
2248
2273
|
var R, D;
|
|
2249
|
-
(R =
|
|
2274
|
+
(R = v.current) == null || R.dispose(), A ? i && Re.set(l, k.current.saveViewState()) : (D = k.current.getModel()) == null || D.dispose(), k.current.dispose();
|
|
2250
2275
|
}
|
|
2251
|
-
return m.createElement(Mt, { width: T, height:
|
|
2276
|
+
return m.createElement(Mt, { width: T, height: W, isEditorReady: N, loading: u, _ref: te, className: j, wrapperProps: E });
|
|
2252
2277
|
}
|
|
2253
|
-
var
|
|
2254
|
-
function
|
|
2255
|
-
const e = Ct(), r = re((j) => j.replaceAll), s =
|
|
2278
|
+
var Zn = Qn, es = Be(Zn), ts = es;
|
|
2279
|
+
function rs() {
|
|
2280
|
+
const e = Ct(), r = re((j) => j.replaceAll), s = oe(), a = m.useRef(null), [o, l] = m.useState("yaml"), [c, f] = m.useState(640), [u, h] = m.useState(() => {
|
|
2256
2281
|
try {
|
|
2257
2282
|
return pe.dump(e, { indent: 2, lineWidth: -1 });
|
|
2258
2283
|
} catch {
|
|
2259
2284
|
return "";
|
|
2260
2285
|
}
|
|
2261
|
-
}), [
|
|
2286
|
+
}), [x, i] = m.useState("");
|
|
2262
2287
|
m.useEffect(() => {
|
|
2263
2288
|
const j = () => {
|
|
2264
|
-
if (
|
|
2265
|
-
const E =
|
|
2266
|
-
f(Math.max(400,
|
|
2289
|
+
if (a.current) {
|
|
2290
|
+
const E = a.current.getBoundingClientRect().top, I = window.innerHeight - E - 20;
|
|
2291
|
+
f(Math.max(400, I));
|
|
2267
2292
|
}
|
|
2268
2293
|
};
|
|
2269
2294
|
return j(), window.addEventListener("resize", j), () => window.removeEventListener("resize", j);
|
|
2270
2295
|
}, []), m.useEffect(() => {
|
|
2271
2296
|
try {
|
|
2272
|
-
const j =
|
|
2297
|
+
const j = o === "json" ? JSON.stringify(e, null, 2) : pe.dump(e, { indent: 2, lineWidth: -1 });
|
|
2273
2298
|
h(j), i("");
|
|
2274
2299
|
} catch (j) {
|
|
2275
2300
|
i(`Failed to serialize: ${j.message}`);
|
|
2276
2301
|
}
|
|
2277
|
-
}, [e,
|
|
2302
|
+
}, [e, o]);
|
|
2278
2303
|
const A = (j) => {
|
|
2279
2304
|
h(j || ""), i("");
|
|
2280
2305
|
}, T = () => {
|
|
2281
2306
|
try {
|
|
2282
2307
|
let j;
|
|
2283
|
-
if (
|
|
2308
|
+
if (o === "json" ? j = JSON.parse(u) : j = pe.load(u), !j || typeof j != "object")
|
|
2284
2309
|
throw new Error("Invalid form data: must be an object");
|
|
2285
2310
|
Array.isArray(j.fields) || (j.fields = j.fields || []), r(j), i(""), s.preview.set(!1), s.codeEditor.set(!1);
|
|
2286
2311
|
} catch (j) {
|
|
2287
|
-
i(`Invalid ${
|
|
2312
|
+
i(`Invalid ${o.toUpperCase()}: ${j.message}`);
|
|
2288
2313
|
}
|
|
2289
|
-
},
|
|
2314
|
+
}, W = (j) => {
|
|
2290
2315
|
try {
|
|
2291
2316
|
let E;
|
|
2292
|
-
const
|
|
2293
|
-
j === "json" ? E = JSON.stringify(
|
|
2317
|
+
const I = o === "json" ? JSON.parse(u) : pe.load(u);
|
|
2318
|
+
j === "json" ? E = JSON.stringify(I, null, 2) : E = pe.dump(I, { indent: 2, lineWidth: -1 }), h(E), l(j), i("");
|
|
2294
2319
|
} catch (E) {
|
|
2295
2320
|
i(`Cannot convert: ${E.message}`);
|
|
2296
2321
|
}
|
|
2297
2322
|
};
|
|
2298
|
-
return /* @__PURE__ */ t.jsxs("div", { ref:
|
|
2323
|
+
return /* @__PURE__ */ t.jsxs("div", { ref: a, className: "code-editor-container flex flex-col bg-gray-50 max-w-7xl w-full", style: { height: `${c}px` }, children: [
|
|
2299
2324
|
/* @__PURE__ */ t.jsxs("div", { className: "code-editor-header flex items-center justify-between gap-3 p-4 bg-white border-b border-black/10", children: [
|
|
2300
2325
|
/* @__PURE__ */ t.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ t.jsxs("div", { className: "flex gap-1 rounded-lg border border-black/10 bg-black/5 p-1", children: [
|
|
2301
2326
|
/* @__PURE__ */ t.jsx(
|
|
2302
2327
|
"button",
|
|
2303
2328
|
{
|
|
2304
|
-
onClick: () =>
|
|
2305
|
-
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${
|
|
2329
|
+
onClick: () => W("yaml"),
|
|
2330
|
+
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${o === "yaml" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
2306
2331
|
children: "YAML"
|
|
2307
2332
|
}
|
|
2308
2333
|
),
|
|
2309
2334
|
/* @__PURE__ */ t.jsx(
|
|
2310
2335
|
"button",
|
|
2311
2336
|
{
|
|
2312
|
-
onClick: () =>
|
|
2313
|
-
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${
|
|
2337
|
+
onClick: () => W("json"),
|
|
2338
|
+
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${o === "json" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
2314
2339
|
children: "JSON"
|
|
2315
2340
|
}
|
|
2316
2341
|
)
|
|
2317
2342
|
] }) }),
|
|
2318
2343
|
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2319
|
-
|
|
2344
|
+
x && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-red-600 bg-red-50 px-3 py-1 rounded-lg", children: x }),
|
|
2320
2345
|
/* @__PURE__ */ t.jsx(
|
|
2321
2346
|
"button",
|
|
2322
2347
|
{
|
|
@@ -2328,10 +2353,10 @@ function Zn() {
|
|
|
2328
2353
|
] })
|
|
2329
2354
|
] }),
|
|
2330
2355
|
/* @__PURE__ */ t.jsx("div", { className: "code-editor-content flex-1 overflow-hidden", children: /* @__PURE__ */ t.jsx(
|
|
2331
|
-
|
|
2356
|
+
ts,
|
|
2332
2357
|
{
|
|
2333
2358
|
height: "100%",
|
|
2334
|
-
language:
|
|
2359
|
+
language: o,
|
|
2335
2360
|
value: u,
|
|
2336
2361
|
onChange: A,
|
|
2337
2362
|
theme: "light",
|
|
@@ -2351,12 +2376,12 @@ function Zn() {
|
|
|
2351
2376
|
) })
|
|
2352
2377
|
] });
|
|
2353
2378
|
}
|
|
2354
|
-
function
|
|
2355
|
-
const r =
|
|
2379
|
+
function ns({ selectedField: e }) {
|
|
2380
|
+
const r = oe(), [s, a] = m.useState(!1), o = r.state.isPreview, l = r.state.isCodeEditor, c = r.state.isEditModalOpen, f = r.state.panelResetKey, u = !o;
|
|
2356
2381
|
return /* @__PURE__ */ t.jsxs("div", { className: "layout-container w-full h-fit rounded-lg mt-2 md:mt-4 lg:mt-6", children: [
|
|
2357
|
-
l ? /* @__PURE__ */ t.jsx("div", { className: "border border-gray-200 rounded-lg", children: /* @__PURE__ */ t.jsx(
|
|
2382
|
+
l ? /* @__PURE__ */ t.jsx("div", { className: "border border-gray-200 rounded-lg", children: /* @__PURE__ */ t.jsx(rs, {}) }) : /* @__PURE__ */ t.jsxs("div", { className: "layout-grid flex lg:gap-3 h-full", children: [
|
|
2358
2383
|
u && /* @__PURE__ */ t.jsx("div", { className: "layout-tool-panel hidden lg:block lg:w-72", children: /* @__PURE__ */ t.jsx(mt, {}) }),
|
|
2359
|
-
/* @__PURE__ */ t.jsx("div", { className: "layout-main-content flex-1 ", children: /* @__PURE__ */ t.jsx(
|
|
2384
|
+
/* @__PURE__ */ t.jsx("div", { className: "layout-main-content flex-1 min-w-0", children: /* @__PURE__ */ t.jsx(Vr, {}) }),
|
|
2360
2385
|
u && /* @__PURE__ */ t.jsx("div", { className: "layout-edit-panel hidden lg:block lg:w-90 md:w-80", children: /* @__PURE__ */ t.jsx(gt, {}, f) }),
|
|
2361
2386
|
u && /* @__PURE__ */ t.jsx("div", { className: "layout-mobile-modal lg:hidden", children: c && e && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
2362
2387
|
/* @__PURE__ */ t.jsx(
|
|
@@ -2373,7 +2398,7 @@ function es({ selectedField: e }) {
|
|
|
2373
2398
|
/* @__PURE__ */ t.jsx(
|
|
2374
2399
|
"button",
|
|
2375
2400
|
{
|
|
2376
|
-
onClick: () =>
|
|
2401
|
+
onClick: () => a(!s),
|
|
2377
2402
|
className: "lg:hidden fixed bottom-5 left-5 z-40 bg-blue-500 hover:bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center shadow-lg transition-all",
|
|
2378
2403
|
title: "Add field",
|
|
2379
2404
|
children: /* @__PURE__ */ t.jsx("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ t.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 4v16m8-8H4" }) })
|
|
@@ -2384,7 +2409,7 @@ function es({ selectedField: e }) {
|
|
|
2384
2409
|
"div",
|
|
2385
2410
|
{
|
|
2386
2411
|
className: "fixed inset-0 z-40 bg-black/30 lg:hidden",
|
|
2387
|
-
onClick: () =>
|
|
2412
|
+
onClick: () => a(!1)
|
|
2388
2413
|
}
|
|
2389
2414
|
),
|
|
2390
2415
|
/* @__PURE__ */ t.jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 bg-white rounded-t-2xl shadow-2xl max-h-[60vh] overflow-y-auto custom-scrollbar lg:hidden", children: /* @__PURE__ */ t.jsx(mt, {}) })
|
|
@@ -2392,47 +2417,38 @@ function es({ selectedField: e }) {
|
|
|
2392
2417
|
] })
|
|
2393
2418
|
] });
|
|
2394
2419
|
}
|
|
2395
|
-
|
|
2396
|
-
function rs(e, r = ts) {
|
|
2397
|
-
const s = m.useSyncExternalStore(
|
|
2398
|
-
e.subscribe,
|
|
2399
|
-
m.useCallback(() => r(e.getState()), [e, r]),
|
|
2400
|
-
m.useCallback(() => r(e.getInitialState()), [e, r])
|
|
2401
|
-
);
|
|
2402
|
-
return m.useDebugValue(s), s;
|
|
2403
|
-
}
|
|
2404
|
-
function ns({
|
|
2420
|
+
function ss({
|
|
2405
2421
|
initialFormData: e,
|
|
2406
2422
|
schemaType: r,
|
|
2407
2423
|
onChange: s,
|
|
2408
|
-
className:
|
|
2409
|
-
showHeader:
|
|
2424
|
+
className: a = "",
|
|
2425
|
+
showHeader: o = !0,
|
|
2410
2426
|
startInPreview: l = !1,
|
|
2411
2427
|
hideUnsupportedFields: c = !1
|
|
2412
2428
|
}) {
|
|
2413
|
-
const [f, u] = m.useState("json"), h =
|
|
2429
|
+
const [f, u] = m.useState("json"), h = oe(), x = m.useRef(!1), i = m.useContext(He);
|
|
2414
2430
|
m.useEffect(() => {
|
|
2415
2431
|
var T;
|
|
2416
|
-
if (!(
|
|
2432
|
+
if (!(x.current || !i)) {
|
|
2417
2433
|
if (e)
|
|
2418
2434
|
try {
|
|
2419
|
-
const { data:
|
|
2435
|
+
const { data: W, schemaType: j } = Et(e, r), E = Nt(W, j);
|
|
2420
2436
|
E.conversionReport && h.setConversionReport(E.conversionReport);
|
|
2421
|
-
const
|
|
2422
|
-
schemaType: j === "surveyjs" ? "mieforms-v1.0" :
|
|
2437
|
+
const I = {
|
|
2438
|
+
schemaType: j === "surveyjs" ? "mieforms-v1.0" : W.schemaType || "mieforms-v1.0",
|
|
2423
2439
|
fields: E.fields || []
|
|
2424
2440
|
};
|
|
2425
2441
|
if (j === "surveyjs" && ((T = E.conversionReport) != null && T.surveyMetadata))
|
|
2426
|
-
Object.assign(
|
|
2442
|
+
Object.assign(I, E.conversionReport.surveyMetadata);
|
|
2427
2443
|
else if (j === "mieforms") {
|
|
2428
|
-
const { fields: y, schemaType: S, ...p } =
|
|
2429
|
-
Object.keys(p).length > 0 && Object.assign(
|
|
2444
|
+
const { fields: y, schemaType: S, ...p } = W;
|
|
2445
|
+
Object.keys(p).length > 0 && Object.assign(I, p);
|
|
2430
2446
|
}
|
|
2431
|
-
Array.isArray(
|
|
2447
|
+
Array.isArray(I.fields) && I.fields.length && i.getState().replaceAll(I);
|
|
2432
2448
|
} catch {
|
|
2433
2449
|
i.getState().replaceAll({ schemaType: "mieforms-v1.0", fields: [] });
|
|
2434
2450
|
}
|
|
2435
|
-
h.preview.set(!!l),
|
|
2451
|
+
h.preview.set(!!l), x.current = !0;
|
|
2436
2452
|
}
|
|
2437
2453
|
}, [e, r, l, h, i]), m.useEffect(() => {
|
|
2438
2454
|
h.setHideUnsupportedFields(c);
|
|
@@ -2442,24 +2458,24 @@ function ns({
|
|
|
2442
2458
|
s({
|
|
2443
2459
|
schemaType: T.schemaType || "mieforms-v1.0",
|
|
2444
2460
|
...T.schemaMetadata,
|
|
2445
|
-
fields: T.order.map((
|
|
2461
|
+
fields: T.order.map((W) => T.byId[W])
|
|
2446
2462
|
});
|
|
2447
2463
|
});
|
|
2448
2464
|
}, [s, i]);
|
|
2449
|
-
const A =
|
|
2465
|
+
const A = Pr(
|
|
2450
2466
|
i,
|
|
2451
2467
|
(T) => h.selectedFieldId.value ? T.byId[h.selectedFieldId.value] : null
|
|
2452
2468
|
);
|
|
2453
|
-
return /* @__PURE__ */ t.jsxs("div", { className: `qb-editor-root editor-container w-full max-w-7xl mx-auto bg-gray-100 font-titillium ${
|
|
2454
|
-
|
|
2455
|
-
/* @__PURE__ */ t.jsx(
|
|
2469
|
+
return /* @__PURE__ */ t.jsxs("div", { className: `qb-editor-root editor-container w-full max-w-7xl mx-auto bg-gray-100 font-titillium ${a}`, children: [
|
|
2470
|
+
o && /* @__PURE__ */ t.jsx(Fr, { codeFormat: f, onCodeFormatChange: u }),
|
|
2471
|
+
/* @__PURE__ */ t.jsx(ns, { selectedField: A, codeFormat: f })
|
|
2456
2472
|
] });
|
|
2457
2473
|
}
|
|
2458
|
-
function
|
|
2459
|
-
const r = m.useRef(
|
|
2460
|
-
return /* @__PURE__ */ t.jsx(He.Provider, { value: r, children: /* @__PURE__ */ t.jsx(
|
|
2474
|
+
function cs(e) {
|
|
2475
|
+
const r = m.useRef(Rr()).current, s = m.useRef(Tr()).current;
|
|
2476
|
+
return /* @__PURE__ */ t.jsx(He.Provider, { value: r, children: /* @__PURE__ */ t.jsx(kr.Provider, { value: s, children: /* @__PURE__ */ t.jsx(ss, { ...e }) }) });
|
|
2461
2477
|
}
|
|
2462
2478
|
export {
|
|
2463
|
-
|
|
2479
|
+
cs as QuestionnaireEditor
|
|
2464
2480
|
};
|
|
2465
2481
|
//# sourceMappingURL=index.js.map
|