@mieweb/forms-editor 0.1.14 → 1.0.0
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 +11 -1
- package/dist/index.js +1939 -1215
- package/dist/index.js.map +1 -1
- package/package.json +40 -39
package/dist/index.js
CHANGED
|
@@ -5,16 +5,15 @@
|
|
|
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.16 | MIT License | https://tailwindcss.com */\n@layer properties;\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-3 {\n top: calc(var(--spacing) * 3);\n}\n.top-5 {\n top: calc(var(--spacing) * 5);\n}\n.right-5 {\n right: calc(var(--spacing) * 5);\n}\n.right-7 {\n right: calc(var(--spacing) * 7);\n}\n.bottom-0 {\n bottom: calc(var(--spacing) * 0);\n}\n.bottom-5 {\n bottom: calc(var(--spacing) * 5);\n}\n.left-0 {\n left: calc(var(--spacing) * 0);\n}\n.left-1\\/2 {\n left: calc(1/2 * 100%);\n}\n.z-10 {\n z-index: 10;\n}\n.z-30 {\n z-index: 30;\n}\n.z-49 {\n z-index: 49;\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-29 {\n margin-inline: calc(var(--spacing) * 29);\n}\n.mx-auto {\n margin-inline: auto;\n}\n.my-1\\.5 {\n margin-block: calc(var(--spacing) * 1.5);\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-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-6 {\n margin-top: calc(var(--spacing) * 6);\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-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.ml-2 {\n margin-left: calc(var(--spacing) * 2);\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-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-72 {\n height: calc(var(--spacing) * 72);\n}\n.h-dvh {\n height: 100dvh;\n}\n.h-fit {\n height: fit-content;\n}\n.h-full {\n height: 100%;\n}\n.max-h-32 {\n max-height: calc(var(--spacing) * 32);\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-\\[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-19rem\\)\\] {\n max-height: calc(100svh - 19rem);\n}\n.max-h-screen {\n max-height: 100vh;\n}\n.min-h-24 {\n min-height: calc(var(--spacing) * 24);\n}\n.min-h-dvh {\n min-height: 100dvh;\n}\n.min-h-screen {\n min-height: 100vh;\n}\n.custom-scrollbar {\n &::-webkit-scrollbar {\n width: calc(var(--spacing) * 1.5);\n }\n &::-webkit-scrollbar-thumb {\n border-radius: calc(infinity * 1px);\n }\n &::-webkit-scrollbar-thumb {\n background-color: var(--color-gray-500);\n }\n &::-webkit-scrollbar-track {\n border-radius: calc(infinity * 1px);\n }\n &::-webkit-scrollbar-track {\n background-color: var(--color-gray-100);\n }\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-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-9 {\n width: calc(var(--spacing) * 9);\n}\n.w-12 {\n width: calc(var(--spacing) * 12);\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-6xl {\n max-width: var(--container-6xl);\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-\\[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-x-1\\/2 {\n --tw-translate-x: 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.cursor-pointer {\n cursor: pointer;\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-around {\n justify-content: space-around;\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.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.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.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-scroll {\n overflow-y: scroll;\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-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n}\n.border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n}\n.border-\\[\\#0076a8\\] {\n border-color: #0076a8;\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-black\\/40 {\n border-color: color-mix(in srgb, #000 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-black) 40%, transparent);\n }\n}\n.border-blue-100 {\n border-color: var(--color-blue-100);\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-gray-200 {\n border-color: var(--color-gray-200);\n}\n.border-gray-300 {\n border-color: var(--color-gray-300);\n}\n.border-gray-900 {\n border-color: var(--color-gray-900);\n}\n.border-orange-500 {\n border-color: var(--color-orange-500);\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-200\\/60 {\n border-color: color-mix(in srgb, oklch(92.9% 0.013 255.508) 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-slate-200) 60%, transparent);\n }\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-\\[\\#0076a8\\] {\n background-color: #0076a8;\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\\/10 {\n background-color: color-mix(in srgb, #000 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 10%, 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\\/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-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-900 {\n background-color: var(--color-gray-900);\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-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-slate-100\\/60 {\n background-color: color-mix(in srgb, oklch(96.8% 0.007 247.896) 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-slate-100) 60%, transparent);\n }\n}\n.bg-slate-100\\/80 {\n background-color: color-mix(in srgb, oklch(96.8% 0.007 247.896) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-slate-100) 80%, transparent);\n }\n}\n.bg-slate-300\\/50 {\n background-color: color-mix(in srgb, oklch(86.9% 0.022 252.894) 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-slate-300) 50%, transparent);\n }\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-transparent\\/30 {\n background-color: color-mix(in oklab, transparent 30%, 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.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-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-indigo-50 {\n --tw-gradient-to: var(--color-indigo-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-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.p-0 {\n padding: calc(var(--spacing) * 0);\n}\n.p-1 {\n padding: calc(var(--spacing) * 1);\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.px-2 {\n padding-inline: calc(var(--spacing) * 2);\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.px-9 {\n padding-inline: calc(var(--spacing) * 9);\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-6 {\n padding-block: calc(var(--spacing) * 6);\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-4 {\n padding-top: calc(var(--spacing) * 4);\n}\n.pt-8 {\n padding-top: calc(var(--spacing) * 8);\n}\n.pr-2 {\n padding-right: calc(var(--spacing) * 2);\n}\n.pb-2\\.5 {\n padding-bottom: calc(var(--spacing) * 2.5);\n}\n.pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n}\n.pb-5 {\n padding-bottom: calc(var(--spacing) * 5);\n}\n.pb-8 {\n padding-bottom: calc(var(--spacing) * 8);\n}\n.pl-6 {\n padding-left: calc(var(--spacing) * 6);\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-3xl {\n font-size: var(--text-3xl);\n line-height: var(--tw-leading, var(--text-3xl--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-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.tracking-wider {\n --tw-tracking: var(--tracking-wider);\n letter-spacing: var(--tracking-wider);\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-black {\n color: var(--color-black);\n}\n.text-black\\/60 {\n color: color-mix(in srgb, #000 60%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, var(--color-black) 60%, transparent);\n }\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-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-indigo-700 {\n color: var(--color-indigo-700);\n}\n.text-orange-700 {\n color: var(--color-orange-700);\n}\n.text-red-400 {\n color: var(--color-red-400);\n}\n.text-red-600 {\n color: var(--color-red-600);\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-900 {\n color: var(--color-slate-900);\n}\n.text-stone-900 {\n color: var(--color-stone-900);\n}\n.text-white {\n color: var(--color-white);\n}\n.italic {\n font-style: italic;\n}\n.opacity-70 {\n opacity: 70%;\n}\n.opacity-100 {\n opacity: 100%;\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.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-sm {\n --tw-backdrop-blur: blur(var(--blur-sm));\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.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-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-gray-400);\n }\n }\n}\n.hover\\:border-slate-300 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-slate-300);\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-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-600);\n }\n }\n}\n.hover\\:bg-gray-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-50);\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-slate-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-50);\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\\:text-gray-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-gray-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.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.sm\\:col-span-1 {\n @media (width >= 40rem) {\n grid-column: span 1 / span 1;\n }\n}\n.sm\\:col-span-2 {\n @media (width >= 40rem) {\n grid-column: span 2 / span 2;\n }\n}\n.sm\\:col-span-3 {\n @media (width >= 40rem) {\n grid-column: span 3 / span 3;\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\\:grid-cols-3 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n}\n.sm\\:grid-cols-7 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(7, 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.sm\\:text-4xl {\n @media (width >= 40rem) {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n }\n}\n.md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\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\\:block {\n @media (width >= 64rem) {\n display: block;\n }\n}\n.lg\\:hidden {\n @media (width >= 64rem) {\n display: none;\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-15rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 15rem);\n }\n}\n.lg\\:grid-cols-2 {\n @media (width >= 64rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.lg\\:grid-cols-\\[280px_minmax\\(0\\,1fr\\)_320px\\] {\n @media (width >= 64rem) {\n grid-template-columns: 280px minmax(0,1fr) 320px;\n }\n}\n.lg\\:grid-cols-\\[minmax\\(0\\,1fr\\)\\] {\n @media (width >= 64rem) {\n grid-template-columns: minmax(0,1fr);\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-400: oklch(70.4% 0.191 22.216);\n --color-red-600: oklch(57.7% 0.245 27.325);\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-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-800: oklch(42.4% 0.199 265.638);\n --color-indigo-50: oklch(96.2% 0.018 272.314);\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-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-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-gray-900: oklch(21% 0.034 264.665);\n --color-neutral-100: oklch(97% 0 0);\n --color-stone-900: oklch(21.6% 0.006 56.043);\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-6xl: 72rem;\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-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 --font-weight-light: 300;\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 --tracking-wider: 0.05em;\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-sm: 8px;\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}\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[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-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@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-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 }\n }\n}\n";
|
|
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.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-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-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-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-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.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-\\[80svw\\] {\n max-width: 80svw;\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.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\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-black\\/40 {\n border-color: color-mix(in srgb, #000 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-black) 40%, 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-green-100 {\n background-color: var(--color-green-100);\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-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-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-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-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 {\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.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-green-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-green-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.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-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-\\[75svw\\] {\n @media (width >= 48rem) {\n max-width: 75svw;\n }\n}\n.md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\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-100: oklch(96.2% 0.044 156.743);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-green-700: oklch(52.7% 0.154 150.069);\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-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-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";
|
|
9
9
|
document.head.appendChild(style);
|
|
10
10
|
}
|
|
11
11
|
window.__QUESTIONNAIRE_EDITOR_CSS_INJECTED = true;
|
|
12
12
|
})();
|
|
13
|
-
import
|
|
14
|
-
import { useFormStore as
|
|
15
|
-
import
|
|
16
|
-
|
|
17
|
-
var pe = { exports: {} }, se = {};
|
|
13
|
+
import m, { useCallback as Te, useMemo as Ye, memo as Be, useState as ke, useRef as K, useEffect as oe } from "react";
|
|
14
|
+
import { useFormStore as re, useFormData as Ct, useUIApi as ae, 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 xr, SELECTINPUT_ICON as vr, FOLDERS_ICON as yr, TEXTINPUT_ICON as jr, TRASHCANTWO_ICON as ye, useFormApi as Je, FormStoreContext as He, ARROWDOWN_ICON as wr, EDIT_ICON as Cr, EYEEDIT_ICON as Er, useVisibleFields as Nr, useUIStore as Or, getFieldComponent as Sr, createFormStore as Ir, createUIStore as Rr, UIStoreContext as Tr } from "@mieweb/forms-engine";
|
|
15
|
+
import pe from "js-yaml";
|
|
16
|
+
var Se = { exports: {} }, ge = {};
|
|
18
17
|
/**
|
|
19
18
|
* @license React
|
|
20
19
|
* react-jsx-runtime.production.min.js
|
|
@@ -24,21 +23,21 @@ var pe = { exports: {} }, se = {};
|
|
|
24
23
|
* This source code is licensed under the MIT license found in the
|
|
25
24
|
* LICENSE file in the root directory of this source tree.
|
|
26
25
|
*/
|
|
27
|
-
var
|
|
28
|
-
function
|
|
29
|
-
if (
|
|
30
|
-
|
|
31
|
-
var
|
|
32
|
-
function
|
|
33
|
-
var
|
|
34
|
-
|
|
35
|
-
for (
|
|
36
|
-
if (
|
|
37
|
-
return { $$typeof:
|
|
26
|
+
var dt;
|
|
27
|
+
function kr() {
|
|
28
|
+
if (dt) return ge;
|
|
29
|
+
dt = 1;
|
|
30
|
+
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
|
|
31
|
+
function c(f, u, h) {
|
|
32
|
+
var v, i = {}, A = null, T = null;
|
|
33
|
+
h !== void 0 && (A = "" + h), u.key !== void 0 && (A = "" + u.key), u.ref !== void 0 && (T = u.ref);
|
|
34
|
+
for (v in u) o.call(u, v) && !l.hasOwnProperty(v) && (i[v] = u[v]);
|
|
35
|
+
if (f && f.defaultProps) for (v in u = f.defaultProps, u) i[v] === void 0 && (i[v] = u[v]);
|
|
36
|
+
return { $$typeof: r, type: f, key: A, ref: T, props: i, _owner: a.current };
|
|
38
37
|
}
|
|
39
|
-
return
|
|
38
|
+
return ge.Fragment = s, ge.jsx = c, ge.jsxs = c, ge;
|
|
40
39
|
}
|
|
41
|
-
var
|
|
40
|
+
var be = {};
|
|
42
41
|
/**
|
|
43
42
|
* @license React
|
|
44
43
|
* react-jsx-runtime.development.js
|
|
@@ -48,91 +47,91 @@ var ne = {};
|
|
|
48
47
|
* This source code is licensed under the MIT license found in the
|
|
49
48
|
* LICENSE file in the root directory of this source tree.
|
|
50
49
|
*/
|
|
51
|
-
var
|
|
52
|
-
function
|
|
53
|
-
return
|
|
54
|
-
var
|
|
55
|
-
function
|
|
56
|
-
if (
|
|
50
|
+
var ut;
|
|
51
|
+
function Pr() {
|
|
52
|
+
return ut || (ut = 1, process.env.NODE_ENV !== "production" && (function() {
|
|
53
|
+
var e = m, r = Symbol.for("react.element"), s = Symbol.for("react.portal"), o = Symbol.for("react.fragment"), a = 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"), v = Symbol.for("react.suspense_list"), i = Symbol.for("react.memo"), A = Symbol.for("react.lazy"), T = Symbol.for("react.offscreen"), V = Symbol.iterator, j = "@@iterator";
|
|
54
|
+
function E(n) {
|
|
55
|
+
if (n === null || typeof n != "object")
|
|
57
56
|
return null;
|
|
58
|
-
var
|
|
59
|
-
return typeof
|
|
57
|
+
var d = V && n[V] || n[j];
|
|
58
|
+
return typeof d == "function" ? d : null;
|
|
60
59
|
}
|
|
61
|
-
var
|
|
62
|
-
function
|
|
60
|
+
var O = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
61
|
+
function y(n) {
|
|
63
62
|
{
|
|
64
|
-
for (var
|
|
65
|
-
|
|
66
|
-
|
|
63
|
+
for (var d = arguments.length, b = new Array(d > 1 ? d - 1 : 0), C = 1; C < d; C++)
|
|
64
|
+
b[C - 1] = arguments[C];
|
|
65
|
+
S("error", n, b);
|
|
67
66
|
}
|
|
68
67
|
}
|
|
69
|
-
function
|
|
68
|
+
function S(n, d, b) {
|
|
70
69
|
{
|
|
71
|
-
var
|
|
72
|
-
|
|
73
|
-
var
|
|
74
|
-
return String(
|
|
70
|
+
var C = O.ReactDebugCurrentFrame, M = C.getStackAddendum();
|
|
71
|
+
M !== "" && (d += "%s", b = b.concat([M]));
|
|
72
|
+
var $ = b.map(function(_) {
|
|
73
|
+
return String(_);
|
|
75
74
|
});
|
|
76
|
-
|
|
75
|
+
$.unshift("Warning: " + d), Function.prototype.apply.call(console[n], console, $);
|
|
77
76
|
}
|
|
78
77
|
}
|
|
79
|
-
var
|
|
80
|
-
|
|
81
|
-
function
|
|
82
|
-
return !!(typeof
|
|
78
|
+
var p = !1, N = !1, L = !1, W = !1, B = !1, U;
|
|
79
|
+
U = Symbol.for("react.module.reference");
|
|
80
|
+
function k(n) {
|
|
81
|
+
return !!(typeof n == "string" || typeof n == "function" || n === o || n === l || B || n === a || n === h || n === v || W || 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
|
|
83
82
|
// types supported by any Flight configuration anywhere since
|
|
84
83
|
// we don't know which Flight build this will end up being used
|
|
85
84
|
// with.
|
|
86
|
-
|
|
85
|
+
n.$$typeof === U || n.getModuleId !== void 0));
|
|
87
86
|
}
|
|
88
|
-
function
|
|
89
|
-
var
|
|
90
|
-
if (
|
|
91
|
-
return
|
|
92
|
-
var
|
|
93
|
-
return
|
|
87
|
+
function te(n, d, b) {
|
|
88
|
+
var C = n.displayName;
|
|
89
|
+
if (C)
|
|
90
|
+
return C;
|
|
91
|
+
var M = d.displayName || d.name || "";
|
|
92
|
+
return M !== "" ? b + "(" + M + ")" : b;
|
|
94
93
|
}
|
|
95
|
-
function
|
|
96
|
-
return
|
|
94
|
+
function ne(n) {
|
|
95
|
+
return n.displayName || "Context";
|
|
97
96
|
}
|
|
98
|
-
function
|
|
99
|
-
if (
|
|
97
|
+
function G(n) {
|
|
98
|
+
if (n == null)
|
|
100
99
|
return null;
|
|
101
|
-
if (typeof
|
|
102
|
-
return
|
|
103
|
-
if (typeof
|
|
104
|
-
return
|
|
105
|
-
switch (
|
|
106
|
-
case
|
|
100
|
+
if (typeof n.tag == "number" && y("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof n == "function")
|
|
101
|
+
return n.displayName || n.name || null;
|
|
102
|
+
if (typeof n == "string")
|
|
103
|
+
return n;
|
|
104
|
+
switch (n) {
|
|
105
|
+
case o:
|
|
107
106
|
return "Fragment";
|
|
108
|
-
case
|
|
107
|
+
case s:
|
|
109
108
|
return "Portal";
|
|
110
|
-
case
|
|
109
|
+
case l:
|
|
111
110
|
return "Profiler";
|
|
112
|
-
case
|
|
111
|
+
case a:
|
|
113
112
|
return "StrictMode";
|
|
114
|
-
case
|
|
113
|
+
case h:
|
|
115
114
|
return "Suspense";
|
|
116
|
-
case
|
|
115
|
+
case v:
|
|
117
116
|
return "SuspenseList";
|
|
118
117
|
}
|
|
119
|
-
if (typeof
|
|
120
|
-
switch (
|
|
121
|
-
case
|
|
122
|
-
var
|
|
123
|
-
return
|
|
124
|
-
case
|
|
125
|
-
var
|
|
126
|
-
return
|
|
118
|
+
if (typeof n == "object")
|
|
119
|
+
switch (n.$$typeof) {
|
|
120
|
+
case f:
|
|
121
|
+
var d = n;
|
|
122
|
+
return ne(d) + ".Consumer";
|
|
123
|
+
case c:
|
|
124
|
+
var b = n;
|
|
125
|
+
return ne(b._context) + ".Provider";
|
|
126
|
+
case u:
|
|
127
|
+
return te(n, n.render, "ForwardRef");
|
|
127
128
|
case i:
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
case h: {
|
|
133
|
-
var T = e, _ = T._payload, N = T._init;
|
|
129
|
+
var C = n.displayName || null;
|
|
130
|
+
return C !== null ? C : G(n.type) || "Memo";
|
|
131
|
+
case A: {
|
|
132
|
+
var M = n, $ = M._payload, _ = M._init;
|
|
134
133
|
try {
|
|
135
|
-
return
|
|
134
|
+
return G(_($));
|
|
136
135
|
} catch {
|
|
137
136
|
return null;
|
|
138
137
|
}
|
|
@@ -140,746 +139,660 @@ function Bt() {
|
|
|
140
139
|
}
|
|
141
140
|
return null;
|
|
142
141
|
}
|
|
143
|
-
var
|
|
144
|
-
function
|
|
142
|
+
var x = Object.assign, g = 0, w, q, F, J, I, R, D;
|
|
143
|
+
function H() {
|
|
145
144
|
}
|
|
146
|
-
|
|
147
|
-
function
|
|
145
|
+
H.__reactDisabledLog = !0;
|
|
146
|
+
function se() {
|
|
148
147
|
{
|
|
149
|
-
if (
|
|
150
|
-
|
|
151
|
-
var
|
|
148
|
+
if (g === 0) {
|
|
149
|
+
w = console.log, q = console.info, F = console.warn, J = console.error, I = console.group, R = console.groupCollapsed, D = console.groupEnd;
|
|
150
|
+
var n = {
|
|
152
151
|
configurable: !0,
|
|
153
152
|
enumerable: !0,
|
|
154
|
-
value:
|
|
153
|
+
value: H,
|
|
155
154
|
writable: !0
|
|
156
155
|
};
|
|
157
156
|
Object.defineProperties(console, {
|
|
158
|
-
info:
|
|
159
|
-
log:
|
|
160
|
-
warn:
|
|
161
|
-
error:
|
|
162
|
-
group:
|
|
163
|
-
groupCollapsed:
|
|
164
|
-
groupEnd:
|
|
157
|
+
info: n,
|
|
158
|
+
log: n,
|
|
159
|
+
warn: n,
|
|
160
|
+
error: n,
|
|
161
|
+
group: n,
|
|
162
|
+
groupCollapsed: n,
|
|
163
|
+
groupEnd: n
|
|
165
164
|
});
|
|
166
165
|
}
|
|
167
|
-
|
|
166
|
+
g++;
|
|
168
167
|
}
|
|
169
168
|
}
|
|
170
|
-
function
|
|
169
|
+
function ie() {
|
|
171
170
|
{
|
|
172
|
-
if (
|
|
173
|
-
var
|
|
171
|
+
if (g--, g === 0) {
|
|
172
|
+
var n = {
|
|
174
173
|
configurable: !0,
|
|
175
174
|
enumerable: !0,
|
|
176
175
|
writable: !0
|
|
177
176
|
};
|
|
178
177
|
Object.defineProperties(console, {
|
|
179
|
-
log:
|
|
180
|
-
value:
|
|
178
|
+
log: x({}, n, {
|
|
179
|
+
value: w
|
|
181
180
|
}),
|
|
182
|
-
info:
|
|
181
|
+
info: x({}, n, {
|
|
183
182
|
value: q
|
|
184
183
|
}),
|
|
185
|
-
warn:
|
|
186
|
-
value:
|
|
184
|
+
warn: x({}, n, {
|
|
185
|
+
value: F
|
|
187
186
|
}),
|
|
188
|
-
error:
|
|
189
|
-
value:
|
|
187
|
+
error: x({}, n, {
|
|
188
|
+
value: J
|
|
190
189
|
}),
|
|
191
|
-
group:
|
|
192
|
-
value:
|
|
190
|
+
group: x({}, n, {
|
|
191
|
+
value: I
|
|
193
192
|
}),
|
|
194
|
-
groupCollapsed:
|
|
195
|
-
value:
|
|
193
|
+
groupCollapsed: x({}, n, {
|
|
194
|
+
value: R
|
|
196
195
|
}),
|
|
197
|
-
groupEnd:
|
|
198
|
-
value:
|
|
196
|
+
groupEnd: x({}, n, {
|
|
197
|
+
value: D
|
|
199
198
|
})
|
|
200
199
|
});
|
|
201
200
|
}
|
|
202
|
-
|
|
201
|
+
g < 0 && y("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
|
|
203
202
|
}
|
|
204
203
|
}
|
|
205
|
-
var
|
|
206
|
-
function
|
|
204
|
+
var Ae = O.ReactCurrentDispatcher, Me;
|
|
205
|
+
function Ce(n, d, b) {
|
|
207
206
|
{
|
|
208
|
-
if (
|
|
207
|
+
if (Me === void 0)
|
|
209
208
|
try {
|
|
210
209
|
throw Error();
|
|
211
|
-
} catch (
|
|
212
|
-
var
|
|
213
|
-
|
|
210
|
+
} catch (M) {
|
|
211
|
+
var C = M.stack.trim().match(/\n( *(at )?)/);
|
|
212
|
+
Me = C && C[1] || "";
|
|
214
213
|
}
|
|
215
214
|
return `
|
|
216
|
-
` +
|
|
215
|
+
` + Me + n;
|
|
217
216
|
}
|
|
218
217
|
}
|
|
219
|
-
var
|
|
218
|
+
var Fe = !1, Ee;
|
|
220
219
|
{
|
|
221
|
-
var
|
|
222
|
-
|
|
220
|
+
var Lt = typeof WeakMap == "function" ? WeakMap : Map;
|
|
221
|
+
Ee = new Lt();
|
|
223
222
|
}
|
|
224
|
-
function
|
|
225
|
-
if (!
|
|
223
|
+
function Ke(n, d) {
|
|
224
|
+
if (!n || Fe)
|
|
226
225
|
return "";
|
|
227
226
|
{
|
|
228
|
-
var
|
|
229
|
-
if (
|
|
230
|
-
return
|
|
227
|
+
var b = Ee.get(n);
|
|
228
|
+
if (b !== void 0)
|
|
229
|
+
return b;
|
|
231
230
|
}
|
|
232
|
-
var
|
|
233
|
-
|
|
234
|
-
var
|
|
231
|
+
var C;
|
|
232
|
+
Fe = !0;
|
|
233
|
+
var M = Error.prepareStackTrace;
|
|
235
234
|
Error.prepareStackTrace = void 0;
|
|
236
|
-
var
|
|
237
|
-
|
|
235
|
+
var $;
|
|
236
|
+
$ = Ae.current, Ae.current = null, se();
|
|
238
237
|
try {
|
|
239
|
-
if (
|
|
240
|
-
var
|
|
238
|
+
if (d) {
|
|
239
|
+
var _ = function() {
|
|
241
240
|
throw Error();
|
|
242
241
|
};
|
|
243
|
-
if (Object.defineProperty(
|
|
242
|
+
if (Object.defineProperty(_.prototype, "props", {
|
|
244
243
|
set: function() {
|
|
245
244
|
throw Error();
|
|
246
245
|
}
|
|
247
246
|
}), typeof Reflect == "object" && Reflect.construct) {
|
|
248
247
|
try {
|
|
249
|
-
Reflect.construct(
|
|
250
|
-
} catch (
|
|
251
|
-
|
|
248
|
+
Reflect.construct(_, []);
|
|
249
|
+
} catch (Q) {
|
|
250
|
+
C = Q;
|
|
252
251
|
}
|
|
253
|
-
Reflect.construct(
|
|
252
|
+
Reflect.construct(n, [], _);
|
|
254
253
|
} else {
|
|
255
254
|
try {
|
|
256
|
-
|
|
257
|
-
} catch (
|
|
258
|
-
|
|
255
|
+
_.call();
|
|
256
|
+
} catch (Q) {
|
|
257
|
+
C = Q;
|
|
259
258
|
}
|
|
260
|
-
|
|
259
|
+
n.call(_.prototype);
|
|
261
260
|
}
|
|
262
261
|
} else {
|
|
263
262
|
try {
|
|
264
263
|
throw Error();
|
|
265
|
-
} catch (
|
|
266
|
-
|
|
264
|
+
} catch (Q) {
|
|
265
|
+
C = Q;
|
|
267
266
|
}
|
|
268
|
-
|
|
267
|
+
n();
|
|
269
268
|
}
|
|
270
|
-
} catch (
|
|
271
|
-
if (
|
|
272
|
-
for (var
|
|
273
|
-
`),
|
|
274
|
-
`),
|
|
275
|
-
|
|
276
|
-
for (;
|
|
277
|
-
if (
|
|
278
|
-
if (
|
|
269
|
+
} catch (Q) {
|
|
270
|
+
if (Q && C && typeof Q.stack == "string") {
|
|
271
|
+
for (var P = Q.stack.split(`
|
|
272
|
+
`), X = C.stack.split(`
|
|
273
|
+
`), z = P.length - 1, Y = X.length - 1; z >= 1 && Y >= 0 && P[z] !== X[Y]; )
|
|
274
|
+
Y--;
|
|
275
|
+
for (; z >= 1 && Y >= 0; z--, Y--)
|
|
276
|
+
if (P[z] !== X[Y]) {
|
|
277
|
+
if (z !== 1 || Y !== 1)
|
|
279
278
|
do
|
|
280
|
-
if (
|
|
281
|
-
var
|
|
282
|
-
` +
|
|
283
|
-
return
|
|
279
|
+
if (z--, Y--, Y < 0 || P[z] !== X[Y]) {
|
|
280
|
+
var ee = `
|
|
281
|
+
` + P[z].replace(" at new ", " at ");
|
|
282
|
+
return n.displayName && ee.includes("<anonymous>") && (ee = ee.replace("<anonymous>", n.displayName)), typeof n == "function" && Ee.set(n, ee), ee;
|
|
284
283
|
}
|
|
285
|
-
while (
|
|
284
|
+
while (z >= 1 && Y >= 0);
|
|
286
285
|
break;
|
|
287
286
|
}
|
|
288
287
|
}
|
|
289
288
|
} finally {
|
|
290
|
-
|
|
289
|
+
Fe = !1, Ae.current = $, ie(), Error.prepareStackTrace = M;
|
|
291
290
|
}
|
|
292
|
-
var
|
|
293
|
-
return typeof
|
|
291
|
+
var fe = n ? n.displayName || n.name : "", ce = fe ? Ce(fe) : "";
|
|
292
|
+
return typeof n == "function" && Ee.set(n, ce), ce;
|
|
294
293
|
}
|
|
295
|
-
function
|
|
296
|
-
return
|
|
294
|
+
function $t(n, d, b) {
|
|
295
|
+
return Ke(n, !1);
|
|
297
296
|
}
|
|
298
|
-
function
|
|
299
|
-
var
|
|
300
|
-
return !!(
|
|
297
|
+
function Wt(n) {
|
|
298
|
+
var d = n.prototype;
|
|
299
|
+
return !!(d && d.isReactComponent);
|
|
301
300
|
}
|
|
302
|
-
function
|
|
303
|
-
if (
|
|
301
|
+
function Ne(n, d, b) {
|
|
302
|
+
if (n == null)
|
|
304
303
|
return "";
|
|
305
|
-
if (typeof
|
|
306
|
-
return
|
|
307
|
-
if (typeof
|
|
308
|
-
return
|
|
309
|
-
switch (
|
|
310
|
-
case
|
|
311
|
-
return
|
|
312
|
-
case
|
|
313
|
-
return
|
|
304
|
+
if (typeof n == "function")
|
|
305
|
+
return Ke(n, Wt(n));
|
|
306
|
+
if (typeof n == "string")
|
|
307
|
+
return Ce(n);
|
|
308
|
+
switch (n) {
|
|
309
|
+
case h:
|
|
310
|
+
return Ce("Suspense");
|
|
311
|
+
case v:
|
|
312
|
+
return Ce("SuspenseList");
|
|
314
313
|
}
|
|
315
|
-
if (typeof
|
|
316
|
-
switch (
|
|
314
|
+
if (typeof n == "object")
|
|
315
|
+
switch (n.$$typeof) {
|
|
316
|
+
case u:
|
|
317
|
+
return $t(n.render);
|
|
317
318
|
case i:
|
|
318
|
-
return
|
|
319
|
-
case
|
|
320
|
-
|
|
321
|
-
case h: {
|
|
322
|
-
var v = e, T = v._payload, _ = v._init;
|
|
319
|
+
return Ne(n.type, d, b);
|
|
320
|
+
case A: {
|
|
321
|
+
var C = n, M = C._payload, $ = C._init;
|
|
323
322
|
try {
|
|
324
|
-
return
|
|
323
|
+
return Ne($(M), d, b);
|
|
325
324
|
} catch {
|
|
326
325
|
}
|
|
327
326
|
}
|
|
328
327
|
}
|
|
329
328
|
return "";
|
|
330
329
|
}
|
|
331
|
-
var
|
|
332
|
-
function
|
|
333
|
-
if (
|
|
334
|
-
var
|
|
335
|
-
|
|
330
|
+
var he = Object.prototype.hasOwnProperty, Ge = {}, Xe = O.ReactDebugCurrentFrame;
|
|
331
|
+
function Oe(n) {
|
|
332
|
+
if (n) {
|
|
333
|
+
var d = n._owner, b = Ne(n.type, n._source, d ? d.type : null);
|
|
334
|
+
Xe.setExtraStackFrame(b);
|
|
336
335
|
} else
|
|
337
|
-
|
|
336
|
+
Xe.setExtraStackFrame(null);
|
|
338
337
|
}
|
|
339
|
-
function
|
|
338
|
+
function Vt(n, d, b, C, M) {
|
|
340
339
|
{
|
|
341
|
-
var
|
|
342
|
-
for (var
|
|
343
|
-
if (
|
|
344
|
-
var
|
|
340
|
+
var $ = Function.call.bind(he);
|
|
341
|
+
for (var _ in n)
|
|
342
|
+
if ($(n, _)) {
|
|
343
|
+
var P = void 0;
|
|
345
344
|
try {
|
|
346
|
-
if (typeof
|
|
347
|
-
var
|
|
348
|
-
throw
|
|
345
|
+
if (typeof n[_] != "function") {
|
|
346
|
+
var X = Error((C || "React class") + ": " + b + " type `" + _ + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof n[_] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
|
|
347
|
+
throw X.name = "Invariant Violation", X;
|
|
349
348
|
}
|
|
350
|
-
|
|
351
|
-
} catch (
|
|
352
|
-
|
|
349
|
+
P = n[_](d, _, C, b, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
|
|
350
|
+
} catch (z) {
|
|
351
|
+
P = z;
|
|
353
352
|
}
|
|
354
|
-
|
|
353
|
+
P && !(P instanceof Error) && (Oe(M), 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(M), y("Failed %s type: %s", b, P.message), Oe(null));
|
|
355
354
|
}
|
|
356
355
|
}
|
|
357
356
|
}
|
|
358
|
-
var
|
|
359
|
-
function
|
|
360
|
-
return
|
|
357
|
+
var Ut = Array.isArray;
|
|
358
|
+
function De(n) {
|
|
359
|
+
return Ut(n);
|
|
361
360
|
}
|
|
362
|
-
function
|
|
361
|
+
function qt(n) {
|
|
363
362
|
{
|
|
364
|
-
var
|
|
365
|
-
return
|
|
363
|
+
var d = typeof Symbol == "function" && Symbol.toStringTag, b = d && n[Symbol.toStringTag] || n.constructor.name || "Object";
|
|
364
|
+
return b;
|
|
366
365
|
}
|
|
367
366
|
}
|
|
368
|
-
function
|
|
367
|
+
function zt(n) {
|
|
369
368
|
try {
|
|
370
|
-
return
|
|
369
|
+
return Qe(n), !1;
|
|
371
370
|
} catch {
|
|
372
371
|
return !0;
|
|
373
372
|
}
|
|
374
373
|
}
|
|
375
|
-
function
|
|
376
|
-
return "" +
|
|
374
|
+
function Qe(n) {
|
|
375
|
+
return "" + n;
|
|
377
376
|
}
|
|
378
|
-
function
|
|
379
|
-
if (
|
|
380
|
-
return
|
|
377
|
+
function Ze(n) {
|
|
378
|
+
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.", qt(n)), Qe(n);
|
|
381
380
|
}
|
|
382
|
-
var
|
|
381
|
+
var et = O.ReactCurrentOwner, Yt = {
|
|
383
382
|
key: !0,
|
|
384
383
|
ref: !0,
|
|
385
384
|
__self: !0,
|
|
386
385
|
__source: !0
|
|
387
|
-
},
|
|
388
|
-
function
|
|
389
|
-
if (
|
|
390
|
-
var
|
|
391
|
-
if (
|
|
386
|
+
}, tt, rt;
|
|
387
|
+
function Jt(n) {
|
|
388
|
+
if (he.call(n, "ref")) {
|
|
389
|
+
var d = Object.getOwnPropertyDescriptor(n, "ref").get;
|
|
390
|
+
if (d && d.isReactWarning)
|
|
392
391
|
return !1;
|
|
393
392
|
}
|
|
394
|
-
return
|
|
393
|
+
return n.ref !== void 0;
|
|
395
394
|
}
|
|
396
|
-
function
|
|
397
|
-
if (
|
|
398
|
-
var
|
|
399
|
-
if (
|
|
395
|
+
function Bt(n) {
|
|
396
|
+
if (he.call(n, "key")) {
|
|
397
|
+
var d = Object.getOwnPropertyDescriptor(n, "key").get;
|
|
398
|
+
if (d && d.isReactWarning)
|
|
400
399
|
return !1;
|
|
401
400
|
}
|
|
402
|
-
return
|
|
401
|
+
return n.key !== void 0;
|
|
403
402
|
}
|
|
404
|
-
function
|
|
405
|
-
typeof
|
|
403
|
+
function Ht(n, d) {
|
|
404
|
+
typeof n.ref == "string" && et.current;
|
|
406
405
|
}
|
|
407
|
-
function
|
|
406
|
+
function Kt(n, d) {
|
|
408
407
|
{
|
|
409
|
-
var
|
|
410
|
-
|
|
408
|
+
var b = function() {
|
|
409
|
+
tt || (tt = !0, y("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", d));
|
|
411
410
|
};
|
|
412
|
-
|
|
413
|
-
get:
|
|
411
|
+
b.isReactWarning = !0, Object.defineProperty(n, "key", {
|
|
412
|
+
get: b,
|
|
414
413
|
configurable: !0
|
|
415
414
|
});
|
|
416
415
|
}
|
|
417
416
|
}
|
|
418
|
-
function
|
|
417
|
+
function Gt(n, d) {
|
|
419
418
|
{
|
|
420
|
-
var
|
|
421
|
-
|
|
419
|
+
var b = function() {
|
|
420
|
+
rt || (rt = !0, y("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", d));
|
|
422
421
|
};
|
|
423
|
-
|
|
424
|
-
get:
|
|
422
|
+
b.isReactWarning = !0, Object.defineProperty(n, "ref", {
|
|
423
|
+
get: b,
|
|
425
424
|
configurable: !0
|
|
426
425
|
});
|
|
427
426
|
}
|
|
428
427
|
}
|
|
429
|
-
var
|
|
430
|
-
var
|
|
428
|
+
var Xt = function(n, d, b, C, M, $, _) {
|
|
429
|
+
var P = {
|
|
431
430
|
// This tag allows us to uniquely identify this as a React Element
|
|
432
|
-
$$typeof:
|
|
431
|
+
$$typeof: r,
|
|
433
432
|
// Built-in properties that belong on the element
|
|
434
|
-
type:
|
|
435
|
-
key:
|
|
436
|
-
ref:
|
|
437
|
-
props:
|
|
433
|
+
type: n,
|
|
434
|
+
key: d,
|
|
435
|
+
ref: b,
|
|
436
|
+
props: _,
|
|
438
437
|
// Record the component responsible for creating this element.
|
|
439
|
-
_owner:
|
|
438
|
+
_owner: $
|
|
440
439
|
};
|
|
441
|
-
return
|
|
440
|
+
return P._store = {}, Object.defineProperty(P._store, "validated", {
|
|
442
441
|
configurable: !1,
|
|
443
442
|
enumerable: !1,
|
|
444
443
|
writable: !0,
|
|
445
444
|
value: !1
|
|
446
|
-
}), Object.defineProperty(
|
|
445
|
+
}), Object.defineProperty(P, "_self", {
|
|
447
446
|
configurable: !1,
|
|
448
447
|
enumerable: !1,
|
|
449
448
|
writable: !1,
|
|
450
|
-
value:
|
|
451
|
-
}), Object.defineProperty(
|
|
449
|
+
value: C
|
|
450
|
+
}), Object.defineProperty(P, "_source", {
|
|
452
451
|
configurable: !1,
|
|
453
452
|
enumerable: !1,
|
|
454
453
|
writable: !1,
|
|
455
|
-
value:
|
|
456
|
-
}), Object.freeze && (Object.freeze(
|
|
454
|
+
value: M
|
|
455
|
+
}), Object.freeze && (Object.freeze(P.props), Object.freeze(P)), P;
|
|
457
456
|
};
|
|
458
|
-
function
|
|
457
|
+
function Qt(n, d, b, C, M) {
|
|
459
458
|
{
|
|
460
|
-
var _
|
|
461
|
-
|
|
462
|
-
for (
|
|
463
|
-
|
|
464
|
-
if (
|
|
465
|
-
var
|
|
466
|
-
for (
|
|
467
|
-
|
|
459
|
+
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, M));
|
|
461
|
+
for ($ in d)
|
|
462
|
+
he.call(d, $) && !Yt.hasOwnProperty($) && (_[$] = d[$]);
|
|
463
|
+
if (n && n.defaultProps) {
|
|
464
|
+
var z = n.defaultProps;
|
|
465
|
+
for ($ in z)
|
|
466
|
+
_[$] === void 0 && (_[$] = z[$]);
|
|
468
467
|
}
|
|
469
|
-
if (
|
|
470
|
-
var
|
|
471
|
-
|
|
468
|
+
if (P || X) {
|
|
469
|
+
var Y = typeof n == "function" ? n.displayName || n.name || "Unknown" : n;
|
|
470
|
+
P && Kt(_, Y), X && Gt(_, Y);
|
|
472
471
|
}
|
|
473
|
-
return
|
|
472
|
+
return Xt(n, P, X, M, C, et.current, _);
|
|
474
473
|
}
|
|
475
474
|
}
|
|
476
|
-
var
|
|
477
|
-
function
|
|
478
|
-
if (
|
|
479
|
-
var
|
|
480
|
-
|
|
475
|
+
var Le = O.ReactCurrentOwner, nt = O.ReactDebugCurrentFrame;
|
|
476
|
+
function ue(n) {
|
|
477
|
+
if (n) {
|
|
478
|
+
var d = n._owner, b = Ne(n.type, n._source, d ? d.type : null);
|
|
479
|
+
nt.setExtraStackFrame(b);
|
|
481
480
|
} else
|
|
482
|
-
|
|
481
|
+
nt.setExtraStackFrame(null);
|
|
483
482
|
}
|
|
484
|
-
var
|
|
485
|
-
|
|
486
|
-
function
|
|
487
|
-
return typeof
|
|
483
|
+
var $e;
|
|
484
|
+
$e = !1;
|
|
485
|
+
function We(n) {
|
|
486
|
+
return typeof n == "object" && n !== null && n.$$typeof === r;
|
|
488
487
|
}
|
|
489
|
-
function
|
|
488
|
+
function st() {
|
|
490
489
|
{
|
|
491
|
-
if (
|
|
492
|
-
var
|
|
493
|
-
if (
|
|
490
|
+
if (Le.current) {
|
|
491
|
+
var n = G(Le.current.type);
|
|
492
|
+
if (n)
|
|
494
493
|
return `
|
|
495
494
|
|
|
496
|
-
Check the render method of \`` +
|
|
495
|
+
Check the render method of \`` + n + "`.";
|
|
497
496
|
}
|
|
498
497
|
return "";
|
|
499
498
|
}
|
|
500
499
|
}
|
|
501
|
-
function
|
|
500
|
+
function Zt(n) {
|
|
502
501
|
return "";
|
|
503
502
|
}
|
|
504
|
-
var
|
|
505
|
-
function
|
|
503
|
+
var ot = {};
|
|
504
|
+
function er(n) {
|
|
506
505
|
{
|
|
507
|
-
var
|
|
508
|
-
if (!
|
|
509
|
-
var
|
|
510
|
-
|
|
506
|
+
var d = st();
|
|
507
|
+
if (!d) {
|
|
508
|
+
var b = typeof n == "string" ? n : n.displayName || n.name;
|
|
509
|
+
b && (d = `
|
|
511
510
|
|
|
512
|
-
Check the top-level render call using <` +
|
|
511
|
+
Check the top-level render call using <` + b + ">.");
|
|
513
512
|
}
|
|
514
|
-
return
|
|
513
|
+
return d;
|
|
515
514
|
}
|
|
516
515
|
}
|
|
517
|
-
function
|
|
516
|
+
function at(n, d) {
|
|
518
517
|
{
|
|
519
|
-
if (!
|
|
518
|
+
if (!n._store || n._store.validated || n.key != null)
|
|
520
519
|
return;
|
|
521
|
-
|
|
522
|
-
var
|
|
523
|
-
if (
|
|
520
|
+
n._store.validated = !0;
|
|
521
|
+
var b = er(d);
|
|
522
|
+
if (ot[b])
|
|
524
523
|
return;
|
|
525
|
-
|
|
526
|
-
var
|
|
527
|
-
|
|
524
|
+
ot[b] = !0;
|
|
525
|
+
var C = "";
|
|
526
|
+
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);
|
|
528
527
|
}
|
|
529
528
|
}
|
|
530
|
-
function
|
|
529
|
+
function it(n, d) {
|
|
531
530
|
{
|
|
532
|
-
if (typeof
|
|
531
|
+
if (typeof n != "object")
|
|
533
532
|
return;
|
|
534
|
-
if (
|
|
535
|
-
for (var
|
|
536
|
-
var
|
|
537
|
-
|
|
533
|
+
if (De(n))
|
|
534
|
+
for (var b = 0; b < n.length; b++) {
|
|
535
|
+
var C = n[b];
|
|
536
|
+
We(C) && at(C, d);
|
|
538
537
|
}
|
|
539
|
-
else if (
|
|
540
|
-
|
|
541
|
-
else if (
|
|
542
|
-
var
|
|
543
|
-
if (typeof
|
|
544
|
-
for (var
|
|
545
|
-
|
|
538
|
+
else if (We(n))
|
|
539
|
+
n._store && (n._store.validated = !0);
|
|
540
|
+
else if (n) {
|
|
541
|
+
var M = E(n);
|
|
542
|
+
if (typeof M == "function" && M !== n.entries)
|
|
543
|
+
for (var $ = M.call(n), _; !(_ = $.next()).done; )
|
|
544
|
+
We(_.value) && at(_.value, d);
|
|
546
545
|
}
|
|
547
546
|
}
|
|
548
547
|
}
|
|
549
|
-
function
|
|
548
|
+
function tr(n) {
|
|
550
549
|
{
|
|
551
|
-
var
|
|
552
|
-
if (
|
|
550
|
+
var d = n.type;
|
|
551
|
+
if (d == null || typeof d == "string")
|
|
553
552
|
return;
|
|
554
|
-
var
|
|
555
|
-
if (typeof
|
|
556
|
-
|
|
557
|
-
else if (typeof
|
|
553
|
+
var b;
|
|
554
|
+
if (typeof d == "function")
|
|
555
|
+
b = d.propTypes;
|
|
556
|
+
else if (typeof d == "object" && (d.$$typeof === u || // Note: Memo only checks outer props here.
|
|
558
557
|
// Inner props are checked in the reconciler.
|
|
559
|
-
|
|
560
|
-
|
|
558
|
+
d.$$typeof === i))
|
|
559
|
+
b = d.propTypes;
|
|
561
560
|
else
|
|
562
561
|
return;
|
|
563
|
-
if (
|
|
564
|
-
var
|
|
565
|
-
|
|
566
|
-
} else if (
|
|
567
|
-
|
|
568
|
-
var
|
|
569
|
-
|
|
562
|
+
if (b) {
|
|
563
|
+
var C = G(d);
|
|
564
|
+
Vt(b, n.props, "prop", C, n);
|
|
565
|
+
} else if (d.PropTypes !== void 0 && !$e) {
|
|
566
|
+
$e = !0;
|
|
567
|
+
var M = G(d);
|
|
568
|
+
y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", M || "Unknown");
|
|
570
569
|
}
|
|
571
|
-
typeof
|
|
570
|
+
typeof d.getDefaultProps == "function" && !d.getDefaultProps.isReactClassApproved && y("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
|
|
572
571
|
}
|
|
573
572
|
}
|
|
574
|
-
function
|
|
573
|
+
function rr(n) {
|
|
575
574
|
{
|
|
576
|
-
for (var
|
|
577
|
-
var
|
|
578
|
-
if (
|
|
579
|
-
|
|
575
|
+
for (var d = Object.keys(n.props), b = 0; b < d.length; b++) {
|
|
576
|
+
var C = d[b];
|
|
577
|
+
if (C !== "children" && C !== "key") {
|
|
578
|
+
ue(n), y("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", C), ue(null);
|
|
580
579
|
break;
|
|
581
580
|
}
|
|
582
581
|
}
|
|
583
|
-
|
|
582
|
+
n.ref !== null && (ue(n), y("Invalid attribute `ref` supplied to `React.Fragment`."), ue(null));
|
|
584
583
|
}
|
|
585
584
|
}
|
|
586
|
-
var
|
|
587
|
-
function
|
|
585
|
+
var lt = {};
|
|
586
|
+
function ct(n, d, b, C, M, $) {
|
|
588
587
|
{
|
|
589
|
-
var
|
|
590
|
-
if (!
|
|
591
|
-
var
|
|
592
|
-
(
|
|
593
|
-
var
|
|
594
|
-
|
|
595
|
-
var
|
|
596
|
-
|
|
588
|
+
var _ = k(n);
|
|
589
|
+
if (!_) {
|
|
590
|
+
var P = "";
|
|
591
|
+
(n === void 0 || typeof n == "object" && n !== null && Object.keys(n).length === 0) && (P += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
|
|
592
|
+
var X = Zt();
|
|
593
|
+
X ? P += X : P += st();
|
|
594
|
+
var z;
|
|
595
|
+
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);
|
|
597
596
|
}
|
|
598
|
-
var
|
|
599
|
-
if (
|
|
600
|
-
return
|
|
601
|
-
if (
|
|
602
|
-
var
|
|
603
|
-
if (
|
|
604
|
-
if (
|
|
605
|
-
if (
|
|
606
|
-
for (var
|
|
607
|
-
|
|
608
|
-
Object.freeze && Object.freeze(
|
|
597
|
+
var Y = Qt(n, d, b, M, $);
|
|
598
|
+
if (Y == null)
|
|
599
|
+
return Y;
|
|
600
|
+
if (_) {
|
|
601
|
+
var ee = d.children;
|
|
602
|
+
if (ee !== void 0)
|
|
603
|
+
if (C)
|
|
604
|
+
if (De(ee)) {
|
|
605
|
+
for (var fe = 0; fe < ee.length; fe++)
|
|
606
|
+
it(ee[fe], n);
|
|
607
|
+
Object.freeze && Object.freeze(ee);
|
|
609
608
|
} else
|
|
610
|
-
|
|
609
|
+
y("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
|
|
611
610
|
else
|
|
612
|
-
|
|
611
|
+
it(ee, n);
|
|
613
612
|
}
|
|
614
|
-
if (
|
|
615
|
-
var
|
|
616
|
-
return
|
|
617
|
-
}),
|
|
618
|
-
if (!
|
|
619
|
-
var
|
|
620
|
-
|
|
613
|
+
if (he.call(d, "key")) {
|
|
614
|
+
var ce = G(n), Q = Object.keys(d).filter(function(lr) {
|
|
615
|
+
return lr !== "key";
|
|
616
|
+
}), Ve = Q.length > 0 ? "{key: someKey, " + Q.join(": ..., ") + ": ...}" : "{key: someKey}";
|
|
617
|
+
if (!lt[ce + Ve]) {
|
|
618
|
+
var ir = Q.length > 0 ? "{" + Q.join(": ..., ") + ": ...}" : "{}";
|
|
619
|
+
y(`A props object containing a "key" prop is being spread into JSX:
|
|
621
620
|
let props = %s;
|
|
622
621
|
<%s {...props} />
|
|
623
622
|
React keys must be passed directly to JSX without using spread:
|
|
624
623
|
let props = %s;
|
|
625
|
-
<%s key={someKey} {...props} />`,
|
|
624
|
+
<%s key={someKey} {...props} />`, Ve, ce, ir, ce), lt[ce + Ve] = !0;
|
|
626
625
|
}
|
|
627
626
|
}
|
|
628
|
-
return
|
|
627
|
+
return n === o ? rr(Y) : tr(Y), Y;
|
|
629
628
|
}
|
|
630
629
|
}
|
|
631
|
-
function
|
|
632
|
-
return
|
|
633
|
-
}
|
|
634
|
-
function Et(e, s, l) {
|
|
635
|
-
return We(e, s, l, !1);
|
|
636
|
-
}
|
|
637
|
-
var Ct = Et, kt = wt;
|
|
638
|
-
ne.Fragment = c, ne.jsx = Ct, ne.jsxs = kt;
|
|
639
|
-
})()), ne;
|
|
640
|
-
}
|
|
641
|
-
var Ue;
|
|
642
|
-
function Jt() {
|
|
643
|
-
return Ue || (Ue = 1, process.env.NODE_ENV === "production" ? pe.exports = Vt() : pe.exports = Bt()), pe.exports;
|
|
644
|
-
}
|
|
645
|
-
var t = Jt();
|
|
646
|
-
function Xe({
|
|
647
|
-
open: r,
|
|
648
|
-
onClose: n,
|
|
649
|
-
data: a,
|
|
650
|
-
title: c = "Data Viewer",
|
|
651
|
-
placement: o = "center",
|
|
652
|
-
// "center" | "bottom"
|
|
653
|
-
pretty: p = 2,
|
|
654
|
-
defaultMode: b = "yaml",
|
|
655
|
-
// "json" | "yaml"
|
|
656
|
-
fileBaseName: x = "form-data",
|
|
657
|
-
contentClassName: i = ""
|
|
658
|
-
}) {
|
|
659
|
-
const E = o === "center", [g, y] = d.useState(b === "yaml" ? "yaml" : "json"), h = d.useMemo(() => {
|
|
660
|
-
const m = Math.max(2, p | 0);
|
|
661
|
-
try {
|
|
662
|
-
return g === "yaml" ? Ut.dump(a ?? {}, { indent: m, lineWidth: 80, noRefs: !0, forceQuotes: !0, skipInvalid: !0 }) : JSON.stringify(a ?? {}, null, m);
|
|
663
|
-
} catch {
|
|
664
|
-
return g === "yaml" ? "# Failed to render YAML" : String(a);
|
|
665
|
-
}
|
|
666
|
-
}, [a, g, p]), R = (m) => m.stopPropagation(), D = (m) => {
|
|
667
|
-
R(m);
|
|
668
|
-
const k = g === "yaml", j = new Blob([h], { type: k ? "text/yaml" : "application/json" }), O = URL.createObjectURL(j), S = document.createElement("a");
|
|
669
|
-
S.href = O, S.download = `${x}.${k ? "yml" : "json"}`, S.click(), URL.revokeObjectURL(O);
|
|
670
|
-
}, u = async (m) => {
|
|
671
|
-
R(m);
|
|
672
|
-
try {
|
|
673
|
-
await navigator.clipboard.writeText(h);
|
|
674
|
-
} catch {
|
|
630
|
+
function nr(n, d, b) {
|
|
631
|
+
return ct(n, d, b, !0);
|
|
675
632
|
}
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
G.div,
|
|
679
|
-
{
|
|
680
|
-
className: "fixed inset-0 z-[60] flex items-center justify-center",
|
|
681
|
-
initial: { opacity: 0 },
|
|
682
|
-
animate: { opacity: 1 },
|
|
683
|
-
exit: { opacity: 0 },
|
|
684
|
-
onMouseDown: n,
|
|
685
|
-
"aria-modal": "true",
|
|
686
|
-
role: "dialog",
|
|
687
|
-
children: /* @__PURE__ */ t.jsx("div", { className: "w-full h-full flex items-end sm:items-center justify-center sm:max-w-4xl", children: /* @__PURE__ */ t.jsxs(
|
|
688
|
-
G.div,
|
|
689
|
-
{
|
|
690
|
-
onMouseDown: R,
|
|
691
|
-
initial: { y: E ? 20 : "100%", opacity: E ? 0 : 1, scale: E ? 0.98 : 1 },
|
|
692
|
-
animate: { y: 0, opacity: 1, scale: 1 },
|
|
693
|
-
exit: { y: E ? 20 : "100%", opacity: E ? 0 : 1, scale: E ? 0.98 : 1 },
|
|
694
|
-
transition: { type: "spring", stiffness: 160, damping: 20 },
|
|
695
|
-
className: E ? "w-full sm:max-w-2xl sm:rounded-2xl rounded-t-2xl bg-white shadow-lg border border-black/10 max-h-[80vh] overflow-hidden" : "w-full mx-auto bg-black/5 border border-black/15 px-6 py-4 rounded-2xl backdrop-blur-xl overflow-hidden",
|
|
696
|
-
children: [
|
|
697
|
-
/* @__PURE__ */ t.jsxs("div", { className: `flex items-center justify-between ${E ? "px-4 py-3 border-b border-black/10" : ""}`, children: [
|
|
698
|
-
/* @__PURE__ */ t.jsxs("h3", { className: "font-semibold", children: [
|
|
699
|
-
c,
|
|
700
|
-
" (",
|
|
701
|
-
g.toUpperCase(),
|
|
702
|
-
")"
|
|
703
|
-
] }),
|
|
704
|
-
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
705
|
-
/* @__PURE__ */ t.jsxs("div", { className: "inline-flex rounded-lg border border-black/10 overflow-hidden", children: [
|
|
706
|
-
/* @__PURE__ */ t.jsx(
|
|
707
|
-
"button",
|
|
708
|
-
{
|
|
709
|
-
className: `px-3 py-1 text-sm ${g === "yaml" ? "bg-black/6" : "bg-gray-200 hover:bg-black/5"}`,
|
|
710
|
-
"aria-pressed": g === "yaml",
|
|
711
|
-
onClick: (m) => {
|
|
712
|
-
R(m), y("yaml");
|
|
713
|
-
},
|
|
714
|
-
children: "YAML"
|
|
715
|
-
}
|
|
716
|
-
),
|
|
717
|
-
/* @__PURE__ */ t.jsx(
|
|
718
|
-
"button",
|
|
719
|
-
{
|
|
720
|
-
className: `px-3 py-1 text-sm ${g === "json" ? "bg-black/6" : "bg-gray-200 hover:bg-black/5"}`,
|
|
721
|
-
"aria-pressed": g === "json",
|
|
722
|
-
onClick: (m) => {
|
|
723
|
-
R(m), y("json");
|
|
724
|
-
},
|
|
725
|
-
children: "JSON"
|
|
726
|
-
}
|
|
727
|
-
)
|
|
728
|
-
] }),
|
|
729
|
-
/* @__PURE__ */ t.jsx("button", { className: "px-3 py-1 rounded-lg border border-black/10 hover:bg-black/5 text-sm", onClick: u, children: "Copy" }),
|
|
730
|
-
/* @__PURE__ */ t.jsx("button", { className: "px-3 py-1 rounded-lg border border-black/10 hover:bg-black/5 text-sm", onClick: D, children: "Download" }),
|
|
731
|
-
/* @__PURE__ */ t.jsx(
|
|
732
|
-
"button",
|
|
733
|
-
{
|
|
734
|
-
className: "px-3 py-1 rounded-lg border border-black/10 hover:bg-black/5 text-sm",
|
|
735
|
-
onClick: (m) => {
|
|
736
|
-
R(m), n == null || n();
|
|
737
|
-
},
|
|
738
|
-
children: "Close"
|
|
739
|
-
}
|
|
740
|
-
)
|
|
741
|
-
] })
|
|
742
|
-
] }),
|
|
743
|
-
/* @__PURE__ */ t.jsx("div", { className: E ? `p-4 overflow-auto max-h-[70vh] ${i}` : `mt-2 p-2 rounded-lg overflow-y-auto max-h-96 ${i}`, children: /* @__PURE__ */ t.jsx("pre", { className: "whitespace-pre-wrap break-words text-sm text-gray-700", children: h }) })
|
|
744
|
-
]
|
|
745
|
-
}
|
|
746
|
-
) })
|
|
633
|
+
function sr(n, d, b) {
|
|
634
|
+
return ct(n, d, b, !1);
|
|
747
635
|
}
|
|
748
|
-
|
|
636
|
+
var or = sr, ar = nr;
|
|
637
|
+
be.Fragment = o, be.jsx = or, be.jsxs = ar;
|
|
638
|
+
})()), be;
|
|
639
|
+
}
|
|
640
|
+
var ft;
|
|
641
|
+
function _r() {
|
|
642
|
+
return ft || (ft = 1, process.env.NODE_ENV === "production" ? Se.exports = kr() : Se.exports = Pr()), Se.exports;
|
|
749
643
|
}
|
|
750
|
-
|
|
751
|
-
|
|
644
|
+
var t = _r();
|
|
645
|
+
function Ar() {
|
|
646
|
+
const [e, r] = m.useState(!1), [s, o] = m.useState(null), a = re((E) => E.replaceAll), l = Ct(), c = ae(), f = c.state.isPreview, u = c.state.isCodeEditor ?? !1, h = (E) => {
|
|
752
647
|
try {
|
|
753
|
-
const
|
|
754
|
-
if (
|
|
648
|
+
const O = String(E).replace(/^\uFEFF/, "").trim(), { data: y, schemaType: S } = Et(O);
|
|
649
|
+
if (S !== "mieforms" && S !== "surveyjs") {
|
|
755
650
|
alert(`Unsupported or invalid schema format.
|
|
756
651
|
|
|
757
652
|
Expected: MIE Forms or SurveyJS
|
|
758
|
-
Detected: ${
|
|
653
|
+
Detected: ${S}`);
|
|
759
654
|
return;
|
|
760
655
|
}
|
|
761
|
-
|
|
762
|
-
} catch (
|
|
656
|
+
o({ data: y, detectedSchemaType: S }), r(!0);
|
|
657
|
+
} catch (O) {
|
|
763
658
|
alert(`Failed to parse file:
|
|
764
659
|
|
|
765
|
-
${(
|
|
660
|
+
${(O == null ? void 0 : O.message) || "Invalid file format"}`);
|
|
766
661
|
}
|
|
767
|
-
},
|
|
768
|
-
var
|
|
769
|
-
if (
|
|
662
|
+
}, v = (E) => {
|
|
663
|
+
var O;
|
|
664
|
+
if (s)
|
|
770
665
|
try {
|
|
771
|
-
const { data:
|
|
772
|
-
if (!Array.isArray(
|
|
666
|
+
const { data: y } = s, S = Nt(y, E), p = S.fields || [];
|
|
667
|
+
if (!Array.isArray(p))
|
|
773
668
|
throw new Error("Expected array of fields");
|
|
774
|
-
|
|
775
|
-
const
|
|
776
|
-
schemaType:
|
|
777
|
-
fields:
|
|
669
|
+
S.conversionReport && c.setConversionReport(S.conversionReport);
|
|
670
|
+
const N = {
|
|
671
|
+
schemaType: E === "surveyjs" ? "mieforms-v1.0" : y.schemaType || "mieforms-v1.0",
|
|
672
|
+
fields: p
|
|
778
673
|
};
|
|
779
|
-
if (
|
|
780
|
-
Object.assign(
|
|
781
|
-
else if (
|
|
782
|
-
const { fields:
|
|
783
|
-
Object.keys(
|
|
674
|
+
if (E === "surveyjs" && ((O = S.conversionReport) != null && O.surveyMetadata))
|
|
675
|
+
Object.assign(N, S.conversionReport.surveyMetadata);
|
|
676
|
+
else if (E === "mieforms") {
|
|
677
|
+
const { fields: L, schemaType: W, ...B } = y;
|
|
678
|
+
Object.keys(B).length > 0 && Object.assign(N, B);
|
|
784
679
|
}
|
|
785
|
-
|
|
680
|
+
a(N), c.selectedFieldId.clear(), c.preview.set(!1), alert(`✅ Import successful!
|
|
786
681
|
|
|
787
|
-
Format: ${
|
|
788
|
-
Loaded ${
|
|
789
|
-
} catch (
|
|
682
|
+
Format: ${E === "surveyjs" ? "SurveyJS" : "MIE Forms"}
|
|
683
|
+
Loaded ${p.length} field(s)`), r(!1), o(null);
|
|
684
|
+
} catch (y) {
|
|
790
685
|
alert(`Import failed:
|
|
791
686
|
|
|
792
|
-
${(
|
|
687
|
+
${(y == null ? void 0 : y.message) || "Invalid format"}`), r(!1), o(null);
|
|
793
688
|
}
|
|
794
|
-
},
|
|
795
|
-
|
|
796
|
-
},
|
|
797
|
-
|
|
798
|
-
},
|
|
799
|
-
|
|
689
|
+
}, i = () => {
|
|
690
|
+
r(!1), o(null);
|
|
691
|
+
}, A = () => {
|
|
692
|
+
c.preview.set(!1), c.codeEditor.set(!1);
|
|
693
|
+
}, T = () => {
|
|
694
|
+
c.preview.set(!1), c.codeEditor.set(!0);
|
|
695
|
+
}, V = () => {
|
|
696
|
+
c.preview.set(!0), c.codeEditor.set(!1), c.selectedFieldId.clear();
|
|
697
|
+
}, j = () => {
|
|
698
|
+
const E = JSON.stringify(l, null, 2), O = new Blob([E], { type: "application/json" }), y = URL.createObjectURL(O), S = document.createElement("a");
|
|
699
|
+
S.href = y, S.download = "questionnaire.json", S.click(), URL.revokeObjectURL(y);
|
|
800
700
|
};
|
|
801
|
-
return /* @__PURE__ */ t.jsxs("header", { className: "
|
|
802
|
-
/* @__PURE__ */ t.jsxs("div", { className: "
|
|
803
|
-
/* @__PURE__ */ t.jsx("h1", { className: "text-
|
|
804
|
-
/* @__PURE__ */ t.
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
onClick: R,
|
|
821
|
-
children: "Preview"
|
|
822
|
-
}
|
|
823
|
-
)
|
|
824
|
-
] }),
|
|
825
|
-
/* @__PURE__ */ t.jsxs("div", { className: "mt-4 flex flex-wrap gap-2 items-center justify-end", children: [
|
|
826
|
-
/* @__PURE__ */ t.jsxs("label", { className: "px-4 py-2 rounded-xl border border-black/15 bg-white hover:bg-black/5 cursor-pointer text-sm", children: [
|
|
827
|
-
"Import",
|
|
828
|
-
/* @__PURE__ */ t.jsx(
|
|
829
|
-
"input",
|
|
701
|
+
return /* @__PURE__ */ t.jsxs("header", { className: "editor-header w-full bg-white border border-gray-200 rounded-lg shadow-sm", children: [
|
|
702
|
+
/* @__PURE__ */ t.jsxs("div", { className: "px-4 py-4", children: [
|
|
703
|
+
/* @__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 items-center max-[474px]:items-start justify-between gap-3", children: [
|
|
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 max-[474px]:h-[4.5rem]", children: [
|
|
706
|
+
/* @__PURE__ */ t.jsxs(
|
|
707
|
+
"button",
|
|
708
|
+
{
|
|
709
|
+
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 && !u ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
710
|
+
onClick: A,
|
|
711
|
+
title: "Visual Editor",
|
|
712
|
+
children: [
|
|
713
|
+
/* @__PURE__ */ t.jsx(cr, { className: "w-5 h-5" }),
|
|
714
|
+
/* @__PURE__ */ t.jsx("span", { children: "Visual Editor" })
|
|
715
|
+
]
|
|
716
|
+
}
|
|
717
|
+
),
|
|
718
|
+
/* @__PURE__ */ t.jsxs(
|
|
719
|
+
"button",
|
|
830
720
|
{
|
|
831
|
-
className: "
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
721
|
+
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 ${u ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
722
|
+
onClick: T,
|
|
723
|
+
title: "Code Editor",
|
|
724
|
+
children: [
|
|
725
|
+
/* @__PURE__ */ t.jsx(dr, { className: "w-5 h-5" }),
|
|
726
|
+
/* @__PURE__ */ t.jsx("span", { children: "Code Editor" })
|
|
727
|
+
]
|
|
728
|
+
}
|
|
729
|
+
),
|
|
730
|
+
/* @__PURE__ */ t.jsxs(
|
|
731
|
+
"button",
|
|
732
|
+
{
|
|
733
|
+
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: V,
|
|
735
|
+
title: "Preview",
|
|
736
|
+
children: [
|
|
737
|
+
/* @__PURE__ */ t.jsx(ur, { className: "w-5 h-5" }),
|
|
738
|
+
/* @__PURE__ */ t.jsx("span", { children: "Preview" })
|
|
739
|
+
]
|
|
740
|
+
}
|
|
741
|
+
)
|
|
742
|
+
] }),
|
|
743
|
+
/* @__PURE__ */ t.jsxs("div", { className: "header-actions flex flex-col min-[475px]:flex-row gap-1 items-end min-[475px]:items-center", children: [
|
|
744
|
+
/* @__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
|
+
/* @__PURE__ */ t.jsx(fr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
|
|
746
|
+
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[540px]:inline", children: "Import" }),
|
|
747
|
+
/* @__PURE__ */ t.jsx(
|
|
748
|
+
"input",
|
|
749
|
+
{
|
|
750
|
+
className: "hidden",
|
|
751
|
+
type: "file",
|
|
752
|
+
accept: ".json,.yaml,.yml,application/json,text/yaml",
|
|
753
|
+
onChange: (E) => {
|
|
840
754
|
var S;
|
|
841
|
-
|
|
842
|
-
|
|
755
|
+
const O = (S = E.target.files) == null ? void 0 : S[0];
|
|
756
|
+
if (!O) return;
|
|
757
|
+
const y = new FileReader();
|
|
758
|
+
y.onload = (p) => {
|
|
759
|
+
var N;
|
|
760
|
+
return h(((N = p.target) == null ? void 0 : N.result) ?? "");
|
|
761
|
+
}, y.readAsText(O), E.target.value = "";
|
|
762
|
+
}
|
|
843
763
|
}
|
|
764
|
+
)
|
|
765
|
+
] }),
|
|
766
|
+
/* @__PURE__ */ t.jsxs(
|
|
767
|
+
"button",
|
|
768
|
+
{
|
|
769
|
+
className: "px-2 py-2 lg:px-3 lg:py-2 rounded-lg border border-black/15 bg-white hover:bg-black/5 text-xs lg:text-sm font-medium transition-colors flex items-center lg:gap-2 gap-0",
|
|
770
|
+
onClick: j,
|
|
771
|
+
title: "Export",
|
|
772
|
+
children: [
|
|
773
|
+
/* @__PURE__ */ t.jsx(mr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
|
|
774
|
+
/* @__PURE__ */ t.jsx("span", { className: "hidden min-[540px]:inline", children: "Export" })
|
|
775
|
+
]
|
|
844
776
|
}
|
|
845
777
|
)
|
|
846
|
-
] })
|
|
847
|
-
/* @__PURE__ */ t.jsx(
|
|
848
|
-
"button",
|
|
849
|
-
{
|
|
850
|
-
className: "px-4 py-2 rounded-xl border border-black/15 bg-white hover:bg-black/5 text-sm",
|
|
851
|
-
onClick: () => n(!0),
|
|
852
|
-
children: "Data Viewer"
|
|
853
|
-
}
|
|
854
|
-
)
|
|
778
|
+
] })
|
|
855
779
|
] })
|
|
856
780
|
] }),
|
|
857
|
-
/* @__PURE__ */ t.jsx(
|
|
858
|
-
|
|
859
|
-
{
|
|
860
|
-
open: r,
|
|
861
|
-
onClose: () => n(!1),
|
|
862
|
-
data: x,
|
|
863
|
-
title: "Form Data",
|
|
864
|
-
placement: "bottom",
|
|
865
|
-
contentClassName: "custom-scrollbar"
|
|
866
|
-
}
|
|
867
|
-
),
|
|
868
|
-
a && o && /* @__PURE__ */ t.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ t.jsxs("div", { className: "bg-white rounded-2xl shadow-2xl max-w-md w-full p-6", children: [
|
|
869
|
-
/* @__PURE__ */ t.jsxs("div", { className: "mb-6", children: [
|
|
781
|
+
e && s && /* @__PURE__ */ t.jsx("div", { className: "import-modal-overlay fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ t.jsxs("div", { className: "import-modal-content bg-white rounded-2xl shadow-2xl max-w-md w-full p-6", children: [
|
|
782
|
+
/* @__PURE__ */ t.jsxs("div", { className: "import-modal-header mb-6", children: [
|
|
870
783
|
/* @__PURE__ */ t.jsx("h3", { className: "text-xl font-semibold text-slate-900 mb-2", children: "Confirm Schema Type" }),
|
|
871
784
|
/* @__PURE__ */ t.jsxs("p", { className: "text-sm text-slate-600", children: [
|
|
872
785
|
"Is this a ",
|
|
873
|
-
/* @__PURE__ */ t.jsx("strong", { className: "text-slate-900", children:
|
|
786
|
+
/* @__PURE__ */ t.jsx("strong", { className: "text-slate-900", children: s.detectedSchemaType === "surveyjs" ? "SurveyJS" : "MIE Forms" }),
|
|
874
787
|
" schema?"
|
|
875
788
|
] }),
|
|
876
|
-
|
|
789
|
+
s.detectedSchemaType === "surveyjs" && /* @__PURE__ */ t.jsx("p", { className: "text-xs text-slate-500 mt-2", children: "SurveyJS schemas will be converted to MIE Forms format." })
|
|
877
790
|
] }),
|
|
878
|
-
/* @__PURE__ */ t.jsxs("div", { className: "flex gap-3", children: [
|
|
791
|
+
/* @__PURE__ */ t.jsxs("div", { className: "import-modal-actions flex gap-3", children: [
|
|
879
792
|
/* @__PURE__ */ t.jsx(
|
|
880
793
|
"button",
|
|
881
794
|
{
|
|
882
|
-
onClick: () =>
|
|
795
|
+
onClick: () => v(s.detectedSchemaType),
|
|
883
796
|
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",
|
|
884
797
|
children: "Yes, Import"
|
|
885
798
|
}
|
|
@@ -887,7 +800,7 @@ ${(k == null ? void 0 : k.message) || "Invalid format"}`), c(!1), p(null);
|
|
|
887
800
|
/* @__PURE__ */ t.jsx(
|
|
888
801
|
"button",
|
|
889
802
|
{
|
|
890
|
-
onClick:
|
|
803
|
+
onClick: i,
|
|
891
804
|
className: "flex-1 px-6 py-3 rounded-xl border-2 border-slate-300 bg-white hover:bg-slate-50 text-slate-700 font-semibold transition-colors",
|
|
892
805
|
children: "Abort"
|
|
893
806
|
}
|
|
@@ -896,201 +809,174 @@ ${(k == null ? void 0 : k.message) || "Invalid format"}`), c(!1), p(null);
|
|
|
896
809
|
] }) })
|
|
897
810
|
] });
|
|
898
811
|
}
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
812
|
+
const Mr = (e) => {
|
|
813
|
+
switch (e) {
|
|
814
|
+
case "Text Fields":
|
|
815
|
+
return jr;
|
|
816
|
+
case "Organization":
|
|
817
|
+
return yr;
|
|
818
|
+
case "Selection Fields":
|
|
819
|
+
return vr;
|
|
820
|
+
case "Rating & Ranking":
|
|
821
|
+
return xr;
|
|
822
|
+
case "Matrix Fields":
|
|
823
|
+
return br;
|
|
824
|
+
case "Rich Content":
|
|
825
|
+
return gr;
|
|
826
|
+
default:
|
|
827
|
+
return null;
|
|
828
|
+
}
|
|
829
|
+
}, Fr = ({ isPreview: e = !1 }) => {
|
|
830
|
+
if (e) return null;
|
|
831
|
+
const r = re((h) => h.addField), s = ae(), o = re(
|
|
832
|
+
Te(
|
|
833
|
+
(h) => s.selectedFieldId.value ? h.byId[s.selectedFieldId.value] : null,
|
|
834
|
+
[s.selectedFieldId.value]
|
|
835
|
+
)
|
|
836
|
+
), a = (o == null ? void 0 : o.fieldType) === "section", l = (o == null ? void 0 : o.title) || "Section", c = m.useCallback(() => {
|
|
837
|
+
s.selectedFieldId.set(null);
|
|
838
|
+
}, [s.selectedFieldId]);
|
|
839
|
+
m.useEffect(() => {
|
|
840
|
+
const h = (v) => {
|
|
841
|
+
v.key === "Escape" && (v.preventDefault(), v.stopPropagation(), c());
|
|
912
842
|
};
|
|
913
|
-
return
|
|
914
|
-
}, [
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
children: /* @__PURE__ */ t.jsx(Ot, { className: "h-12 w-12" })
|
|
948
|
-
}
|
|
949
|
-
),
|
|
950
|
-
/* @__PURE__ */ t.jsx(
|
|
951
|
-
G.button,
|
|
843
|
+
return window.addEventListener("keydown", h), () => window.removeEventListener("keydown", h);
|
|
844
|
+
}, [c]);
|
|
845
|
+
const f = Ye(() => {
|
|
846
|
+
const h = {};
|
|
847
|
+
return Object.entries(de).filter(([v]) => v !== "unsupported").forEach(([v, i]) => {
|
|
848
|
+
const A = i.category || "Other";
|
|
849
|
+
h[A] || (h[A] = []), h[A].push({
|
|
850
|
+
type: v,
|
|
851
|
+
label: i.label
|
|
852
|
+
});
|
|
853
|
+
}), h;
|
|
854
|
+
}, []), u = Ye(() => {
|
|
855
|
+
const h = {};
|
|
856
|
+
return Object.values(f).forEach((v) => {
|
|
857
|
+
v.forEach(({ type: i }) => {
|
|
858
|
+
h[i] = () => {
|
|
859
|
+
a && (o != null && o.id) ? r(i, { sectionId: o.id }) : r(i);
|
|
860
|
+
};
|
|
861
|
+
});
|
|
862
|
+
}), h;
|
|
863
|
+
}, [f, r, a, o == null ? void 0 : o.id]);
|
|
864
|
+
return /* @__PURE__ */ t.jsx(
|
|
865
|
+
"div",
|
|
866
|
+
{
|
|
867
|
+
className: " border border-gray-200 rounded-lg bg-white overflow-y-auto custom-scrollbar max-h-[calc(100svh-24rem)] lg:max-h-[calc(100dvh-20rem)]",
|
|
868
|
+
tabIndex: "-1",
|
|
869
|
+
children: /* @__PURE__ */ t.jsxs("div", { className: "tool-panel-container pb-4 rounded-lg shadow-sm", children: [
|
|
870
|
+
/* @__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
|
+
/* @__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 flex-shrink-0" }),
|
|
873
|
+
/* @__PURE__ */ t.jsx("span", { className: "truncate", children: a ? `Add to "${l}"` : "Tools" })
|
|
874
|
+
] }),
|
|
875
|
+
a && /* @__PURE__ */ t.jsx(
|
|
876
|
+
"button",
|
|
952
877
|
{
|
|
953
|
-
onClick:
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
scale: a || r ? 0 : 1,
|
|
958
|
-
x: i ? "-120%" : "0%"
|
|
959
|
-
},
|
|
960
|
-
className: `relative cursor-pointer ${i ? "mx-29" : ""} bg-black/5 rounded-2xl p-3 backdrop-blur-xl`,
|
|
961
|
-
children: /* @__PURE__ */ t.jsx(At, { className: "h-12 w-12" })
|
|
878
|
+
onClick: c,
|
|
879
|
+
className: "text-gray-600 hover:text-red-600 hover:bg-red-50 p-1 rounded transition-colors flex-shrink-0",
|
|
880
|
+
title: "Unselect section",
|
|
881
|
+
children: /* @__PURE__ */ t.jsx(pr, { className: "w-5 h-5" })
|
|
962
882
|
}
|
|
963
883
|
)
|
|
964
|
-
]
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
onClose: () => c(!1),
|
|
972
|
-
data: b,
|
|
973
|
-
title: "Form Data",
|
|
974
|
-
placement: "bottom",
|
|
975
|
-
contentClassName: "custom-scrollbar"
|
|
976
|
-
}
|
|
977
|
-
),
|
|
978
|
-
/* @__PURE__ */ t.jsx(
|
|
979
|
-
G.div,
|
|
980
|
-
{
|
|
981
|
-
ref: o,
|
|
982
|
-
onPointerDown: (h) => h.stopPropagation(),
|
|
983
|
-
initial: { opacity: 0, y: "100%", scale: 0 },
|
|
984
|
-
animate: {
|
|
985
|
-
opacity: r ? 1 : 0,
|
|
986
|
-
y: r ? "0%" : "100%",
|
|
987
|
-
scale: r ? 1 : 0.6
|
|
988
|
-
},
|
|
989
|
-
transition: { type: "spring", stiffness: 150, damping: 20 },
|
|
990
|
-
className: "MobileToolBar-Modal fixed bottom-0 w-full mx-auto bg-black/5 border-black/15 border px-9 py-4 mb-2 rounded-2xl backdrop-blur-xl overflow-y-scroll",
|
|
991
|
-
children: /* @__PURE__ */ t.jsxs("div", { className: "grid grid-cols-1 gap-2", children: [
|
|
992
|
-
/* @__PURE__ */ t.jsx("button", { className: "flex w-full justify-end", onClick: () => n(!1), children: /* @__PURE__ */ t.jsx(Pt, {}) }),
|
|
993
|
-
Object.keys(ae).map((h) => /* @__PURE__ */ t.jsxs(
|
|
994
|
-
"button",
|
|
995
|
-
{
|
|
996
|
-
className: "px-4 pl-6 py-2 text-black text-left rounded hover:bg-slate-50",
|
|
997
|
-
onClick: () => {
|
|
998
|
-
p(h), n(!1);
|
|
999
|
-
},
|
|
1000
|
-
children: [
|
|
1001
|
-
"Add ",
|
|
1002
|
-
ae[h].label
|
|
1003
|
-
]
|
|
1004
|
-
},
|
|
884
|
+
] }),
|
|
885
|
+
Object.entries(f).map(([h, v]) => /* @__PURE__ */ t.jsxs("div", { className: "tool-category", children: [
|
|
886
|
+
/* @__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
|
+
const i = Mr(h);
|
|
889
|
+
return i ? /* @__PURE__ */ t.jsx(i, { className: "w-4 h-4 text-gray-600" }) : null;
|
|
890
|
+
})(),
|
|
1005
891
|
h
|
|
1006
|
-
)
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
] });
|
|
1037
|
-
}, Ht = d.memo(Kt, (r, n) => r.isPreview === n.isPreview);
|
|
1038
|
-
function Ze({
|
|
1039
|
-
id: r = "",
|
|
1040
|
-
label: n = "ID",
|
|
1041
|
-
onCommit: a,
|
|
1042
|
-
validate: c,
|
|
1043
|
-
placeholder: o = "Enter unique ID…",
|
|
1044
|
-
className: p = ""
|
|
892
|
+
] }),
|
|
893
|
+
/* @__PURE__ */ t.jsx("div", { className: "tool-items grid grid-cols-1 gap-2 px-4 py-3", children: v.map(({ type: i, label: A }) => {
|
|
894
|
+
const T = a && i === "section";
|
|
895
|
+
return /* @__PURE__ */ t.jsxs(
|
|
896
|
+
"button",
|
|
897
|
+
{
|
|
898
|
+
disabled: T,
|
|
899
|
+
className: `px-3 py-2 text-sm text-left border rounded-md transition-colors duration-150 ${T ? "border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed" : "border-gray-300 hover:bg-blue-50 hover:border-blue-400 hover:text-blue-700"}`,
|
|
900
|
+
onClick: u[i],
|
|
901
|
+
title: T ? "Cannot add section to a section" : `Add ${A}`,
|
|
902
|
+
children: [
|
|
903
|
+
"+ ",
|
|
904
|
+
A
|
|
905
|
+
]
|
|
906
|
+
},
|
|
907
|
+
i
|
|
908
|
+
);
|
|
909
|
+
}) })
|
|
910
|
+
] }, h))
|
|
911
|
+
] })
|
|
912
|
+
}
|
|
913
|
+
);
|
|
914
|
+
}, mt = m.memo(Fr, (e, r) => e.isPreview === r.isPreview);
|
|
915
|
+
function Ot({
|
|
916
|
+
id: e = "",
|
|
917
|
+
label: r = "ID",
|
|
918
|
+
onCommit: s,
|
|
919
|
+
validate: o,
|
|
920
|
+
placeholder: a = "Enter unique ID…",
|
|
921
|
+
className: l = ""
|
|
1045
922
|
}) {
|
|
1046
|
-
const [
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
}, [
|
|
1050
|
-
const
|
|
1051
|
-
const
|
|
1052
|
-
if (!
|
|
1053
|
-
|
|
923
|
+
const [c, f] = m.useState(e ?? ""), [u, h] = m.useState("");
|
|
924
|
+
m.useEffect(() => {
|
|
925
|
+
f(e ?? ""), h("");
|
|
926
|
+
}, [e]);
|
|
927
|
+
const v = m.useCallback(() => {
|
|
928
|
+
const i = String(c ?? "").trim();
|
|
929
|
+
if (!i) {
|
|
930
|
+
h("ID cannot be empty."), f(e ?? "");
|
|
1054
931
|
return;
|
|
1055
932
|
}
|
|
1056
|
-
if (
|
|
1057
|
-
if (typeof
|
|
1058
|
-
const
|
|
1059
|
-
if (
|
|
1060
|
-
|
|
933
|
+
if (i !== (e ?? "")) {
|
|
934
|
+
if (typeof o == "function") {
|
|
935
|
+
const A = o(i, e ?? "");
|
|
936
|
+
if (A) {
|
|
937
|
+
h(A);
|
|
1061
938
|
return;
|
|
1062
939
|
}
|
|
1063
940
|
}
|
|
1064
|
-
|
|
941
|
+
s == null || s(i);
|
|
1065
942
|
}
|
|
1066
|
-
}, [
|
|
1067
|
-
return /* @__PURE__ */ t.jsxs("div", { className:
|
|
1068
|
-
/* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children:
|
|
943
|
+
}, [c, e, s, o]);
|
|
944
|
+
return /* @__PURE__ */ t.jsxs("div", { className: l ? `draft-id-editor-container ${l}` : "draft-id-editor-container", children: [
|
|
945
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: r }),
|
|
1069
946
|
/* @__PURE__ */ t.jsx(
|
|
1070
947
|
"input",
|
|
1071
948
|
{
|
|
1072
949
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
1073
|
-
value:
|
|
1074
|
-
onChange: (
|
|
1075
|
-
|
|
950
|
+
value: c,
|
|
951
|
+
onChange: (i) => {
|
|
952
|
+
u && h(""), f(i.target.value);
|
|
1076
953
|
},
|
|
1077
|
-
onBlur:
|
|
1078
|
-
onKeyDown: (
|
|
1079
|
-
|
|
954
|
+
onBlur: v,
|
|
955
|
+
onKeyDown: (i) => {
|
|
956
|
+
i.key === "Enter" && (i.preventDefault(), v());
|
|
1080
957
|
},
|
|
1081
|
-
placeholder:
|
|
958
|
+
placeholder: a
|
|
1082
959
|
}
|
|
1083
960
|
),
|
|
1084
|
-
|
|
961
|
+
u ? /* @__PURE__ */ t.jsx("p", { className: "text-xs text-red-600 mt-1", children: u }) : null
|
|
1085
962
|
] });
|
|
1086
963
|
}
|
|
1087
|
-
function
|
|
1088
|
-
|
|
964
|
+
function St({ f: e, onUpdateField: r }) {
|
|
965
|
+
const s = re(m.useCallback((a) => a.byId, [])), o = m.useCallback((a, l) => {
|
|
966
|
+
if (!(a != null && a.trim())) return "ID cannot be empty.";
|
|
967
|
+
if (a === l) return "";
|
|
968
|
+
const c = new Set(Object.keys(s));
|
|
969
|
+
return Object.values(s).forEach((f) => {
|
|
970
|
+
(f == null ? void 0 : f.fieldType) === "section" && Array.isArray(f.fields) && f.fields.forEach((u) => c.add(u.id));
|
|
971
|
+
}), c.has(a) ? `ID "${a}" already exists.` : "";
|
|
972
|
+
}, [s]);
|
|
973
|
+
return /* @__PURE__ */ t.jsxs("div", { className: "common-editor-container space-y-3", children: [
|
|
1089
974
|
/* @__PURE__ */ t.jsx(
|
|
1090
|
-
|
|
975
|
+
Ot,
|
|
1091
976
|
{
|
|
1092
|
-
id:
|
|
1093
|
-
|
|
977
|
+
id: e.id ?? "",
|
|
978
|
+
validate: o,
|
|
979
|
+
onCommit: (a) => r == null ? void 0 : r("id", a)
|
|
1094
980
|
}
|
|
1095
981
|
),
|
|
1096
982
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
@@ -1099,8 +985,8 @@ function et({ f: r, onUpdateField: n }) {
|
|
|
1099
985
|
"input",
|
|
1100
986
|
{
|
|
1101
987
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
1102
|
-
value:
|
|
1103
|
-
onChange: (a) =>
|
|
988
|
+
value: e.question || "",
|
|
989
|
+
onChange: (a) => r("question", a.target.value),
|
|
1104
990
|
placeholder: "Enter question text"
|
|
1105
991
|
}
|
|
1106
992
|
)
|
|
@@ -1110,8 +996,8 @@ function et({ f: r, onUpdateField: n }) {
|
|
|
1110
996
|
"input",
|
|
1111
997
|
{
|
|
1112
998
|
type: "checkbox",
|
|
1113
|
-
checked: !!
|
|
1114
|
-
onChange: (a) =>
|
|
999
|
+
checked: !!e.required,
|
|
1000
|
+
onChange: (a) => r("required", a.target.checked)
|
|
1115
1001
|
}
|
|
1116
1002
|
),
|
|
1117
1003
|
"Required"
|
|
@@ -1122,215 +1008,319 @@ function et({ f: r, onUpdateField: n }) {
|
|
|
1122
1008
|
"textarea",
|
|
1123
1009
|
{
|
|
1124
1010
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
1125
|
-
value:
|
|
1126
|
-
onChange: (a) =>
|
|
1011
|
+
value: e.sublabel || "",
|
|
1012
|
+
onChange: (a) => r("sublabel", a.target.value),
|
|
1127
1013
|
placeholder: "Helper text / description"
|
|
1128
1014
|
}
|
|
1129
1015
|
)
|
|
1130
1016
|
] })
|
|
1131
1017
|
] });
|
|
1132
1018
|
}
|
|
1133
|
-
function
|
|
1134
|
-
const
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
"options",
|
|
1145
|
-
a.filter((x) => x.id !== b)
|
|
1146
|
-
);
|
|
1147
|
-
};
|
|
1148
|
-
return /* @__PURE__ */ t.jsxs("div", { className: "mt-3", children: [
|
|
1149
|
-
/* @__PURE__ */ t.jsx("div", { className: "text-sm font-medium mb-1", children: "Options" }),
|
|
1150
|
-
a.map((b) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
|
|
1019
|
+
function It({ field: e, api: r }) {
|
|
1020
|
+
const s = e.options || [], o = e.fieldType === "boolean", a = e.fieldType === "multitext", l = m.useRef(null), c = m.useRef(s.length), f = a ? "Text Inputs" : "Options", u = a ? "Text Input" : "Option", h = a ? "Input label" : "Option text";
|
|
1021
|
+
return m.useEffect(() => {
|
|
1022
|
+
if (s.length > c.current && l.current) {
|
|
1023
|
+
const v = l.current.lastElementChild;
|
|
1024
|
+
v && v.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1025
|
+
}
|
|
1026
|
+
c.current = s.length;
|
|
1027
|
+
}, [s.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1028
|
+
/* @__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((v) => /* @__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: [
|
|
1151
1030
|
/* @__PURE__ */ t.jsx(
|
|
1152
1031
|
"input",
|
|
1153
1032
|
{
|
|
1154
|
-
className: "flex-1
|
|
1155
|
-
value:
|
|
1156
|
-
onChange: (
|
|
1157
|
-
placeholder:
|
|
1033
|
+
className: "flex-1 min-w-0 outline-none bg-transparent",
|
|
1034
|
+
value: v.value,
|
|
1035
|
+
onChange: (i) => r.option.update(v.id, i.target.value),
|
|
1036
|
+
placeholder: h
|
|
1158
1037
|
}
|
|
1159
1038
|
),
|
|
1160
|
-
/* @__PURE__ */ t.jsx(
|
|
1039
|
+
!o && /* @__PURE__ */ t.jsx(
|
|
1161
1040
|
"button",
|
|
1162
1041
|
{
|
|
1163
|
-
onClick: () =>
|
|
1164
|
-
className: "
|
|
1165
|
-
|
|
1042
|
+
onClick: () => r.option.remove(v.id),
|
|
1043
|
+
className: "flex-shrink-0 text-gray-400 hover:text-red-600 transition-colors",
|
|
1044
|
+
title: "Remove option",
|
|
1045
|
+
children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
|
|
1166
1046
|
}
|
|
1167
1047
|
)
|
|
1168
|
-
] },
|
|
1169
|
-
/* @__PURE__ */ t.
|
|
1048
|
+
] }, v.id)) }),
|
|
1049
|
+
!o && /* @__PURE__ */ t.jsxs(
|
|
1170
1050
|
"button",
|
|
1171
1051
|
{
|
|
1172
|
-
onClick:
|
|
1173
|
-
className: "
|
|
1174
|
-
children:
|
|
1052
|
+
onClick: () => r.option.add(""),
|
|
1053
|
+
className: "w-full px-3 py-2 text-sm font-medium text-blue-600 border border-blue-300 rounded-lg hover:bg-blue-50 transition-colors",
|
|
1054
|
+
children: [
|
|
1055
|
+
"+ Add ",
|
|
1056
|
+
u
|
|
1057
|
+
]
|
|
1175
1058
|
}
|
|
1176
1059
|
)
|
|
1177
1060
|
] });
|
|
1178
1061
|
}
|
|
1179
|
-
function
|
|
1180
|
-
const
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1062
|
+
function Rt({ field: e, api: r }) {
|
|
1063
|
+
const s = e.rows || [], o = e.columns || [], a = m.useRef(null), l = m.useRef(null), c = m.useRef(s.length), f = m.useRef(o.length);
|
|
1064
|
+
return m.useEffect(() => {
|
|
1065
|
+
if (s.length > c.current && a.current) {
|
|
1066
|
+
const u = a.current.lastElementChild;
|
|
1067
|
+
u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1068
|
+
}
|
|
1069
|
+
c.current = s.length;
|
|
1070
|
+
}, [s.length]), m.useEffect(() => {
|
|
1071
|
+
if (o.length > f.current && l.current) {
|
|
1072
|
+
const u = l.current.lastElementChild;
|
|
1073
|
+
u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
1074
|
+
}
|
|
1075
|
+
f.current = o.length;
|
|
1076
|
+
}, [o.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-4", children: [
|
|
1077
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1078
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Rows" }),
|
|
1079
|
+
/* @__PURE__ */ t.jsx("div", { ref: a, 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
|
+
/* @__PURE__ */ t.jsx(
|
|
1081
|
+
"input",
|
|
1082
|
+
{
|
|
1083
|
+
className: "flex-1 min-w-0 outline-none bg-transparent",
|
|
1084
|
+
value: u.value,
|
|
1085
|
+
onChange: (h) => r.row.update(u.id, h.target.value),
|
|
1086
|
+
placeholder: "Row text"
|
|
1087
|
+
}
|
|
1088
|
+
),
|
|
1089
|
+
/* @__PURE__ */ t.jsx(
|
|
1090
|
+
"button",
|
|
1091
|
+
{
|
|
1092
|
+
onClick: () => r.row.remove(u.id),
|
|
1093
|
+
className: "flex-shrink-0 text-gray-400 hover:text-red-600 transition-colors",
|
|
1094
|
+
title: "Remove row",
|
|
1095
|
+
children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
|
|
1096
|
+
}
|
|
1097
|
+
)
|
|
1098
|
+
] }, u.id)) }),
|
|
1099
|
+
s.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 rows reached (10)" }) : /* @__PURE__ */ t.jsx(
|
|
1100
|
+
"button",
|
|
1101
|
+
{
|
|
1102
|
+
onClick: () => r.row.add(""),
|
|
1103
|
+
className: "w-full px-3 py-2 text-sm font-medium text-blue-600 border border-blue-300 rounded-lg hover:bg-blue-50 transition-colors",
|
|
1104
|
+
children: "+ Add Row"
|
|
1105
|
+
}
|
|
1106
|
+
)
|
|
1107
|
+
] }),
|
|
1108
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1109
|
+
/* @__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: o.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
|
+
/* @__PURE__ */ t.jsx(
|
|
1112
|
+
"input",
|
|
1113
|
+
{
|
|
1114
|
+
className: "flex-1 min-w-0 outline-none bg-transparent",
|
|
1115
|
+
value: u.value,
|
|
1116
|
+
onChange: (h) => r.column.update(u.id, h.target.value),
|
|
1117
|
+
placeholder: "Column text"
|
|
1118
|
+
}
|
|
1119
|
+
),
|
|
1120
|
+
/* @__PURE__ */ t.jsx(
|
|
1121
|
+
"button",
|
|
1122
|
+
{
|
|
1123
|
+
onClick: () => r.column.remove(u.id),
|
|
1124
|
+
className: "flex-shrink-0 text-gray-400 hover:text-red-600 transition-colors",
|
|
1125
|
+
title: "Remove column",
|
|
1126
|
+
children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
|
|
1127
|
+
}
|
|
1128
|
+
)
|
|
1129
|
+
] }, u.id)) }),
|
|
1130
|
+
o.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
|
+
"button",
|
|
1132
|
+
{
|
|
1133
|
+
onClick: () => r.column.add(""),
|
|
1134
|
+
className: "w-full px-3 py-2 text-sm font-medium text-blue-600 border border-blue-300 rounded-lg hover:bg-blue-50 transition-colors",
|
|
1135
|
+
children: "+ Add Column"
|
|
1136
|
+
}
|
|
1137
|
+
)
|
|
1138
|
+
] })
|
|
1139
|
+
] });
|
|
1140
|
+
}
|
|
1141
|
+
function Dr({ f: e }) {
|
|
1142
|
+
const r = Je(e.id), s = m.useCallback(
|
|
1143
|
+
(c, f) => r.field.update(c, f),
|
|
1144
|
+
[r]
|
|
1145
|
+
), o = de[e.fieldType] || {}, a = o.hasOptions || !1, l = o.hasMatrix || !1;
|
|
1187
1146
|
return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1188
1147
|
/* @__PURE__ */ t.jsx("h3", { className: "text-lg font-semibold mb-3", children: "Edit" }),
|
|
1189
|
-
/* @__PURE__ */ t.jsx(
|
|
1190
|
-
|
|
1148
|
+
/* @__PURE__ */ t.jsx(St, { f: e, onUpdateField: s }),
|
|
1149
|
+
e.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "non-section-editor-default-answer mt-4", children: [
|
|
1191
1150
|
/* @__PURE__ */ t.jsx("div", { className: "text-sm font-medium mb-1", children: "Default Answer" }),
|
|
1192
1151
|
/* @__PURE__ */ t.jsx(
|
|
1193
1152
|
"input",
|
|
1194
1153
|
{
|
|
1195
1154
|
className: "w-full px-3 py-2 border border-black/20 rounded",
|
|
1196
|
-
value:
|
|
1197
|
-
onChange: (
|
|
1155
|
+
value: e.answer || "",
|
|
1156
|
+
onChange: (c) => s("answer", c.target.value),
|
|
1198
1157
|
placeholder: "Default value"
|
|
1199
1158
|
}
|
|
1200
1159
|
)
|
|
1201
1160
|
] }),
|
|
1202
|
-
|
|
1161
|
+
a && /* @__PURE__ */ t.jsx(It, { field: e, api: r }),
|
|
1162
|
+
l && /* @__PURE__ */ t.jsx(Rt, { field: e, api: r })
|
|
1203
1163
|
] });
|
|
1204
1164
|
}
|
|
1205
|
-
function
|
|
1206
|
-
var
|
|
1207
|
-
const
|
|
1208
|
-
if (!
|
|
1209
|
-
const
|
|
1210
|
-
|
|
1211
|
-
|
|
1212
|
-
|
|
1213
|
-
}, [
|
|
1214
|
-
|
|
1215
|
-
|
|
1165
|
+
function Lr({ section: e, onActiveChildChange: r }) {
|
|
1166
|
+
var y, S;
|
|
1167
|
+
const s = Je(e.id), o = m.useContext(He), a = ae();
|
|
1168
|
+
if (!o) throw new Error("Missing FormStoreContext.Provider in the tree");
|
|
1169
|
+
const l = Array.isArray(e.fields) ? e.fields : [], [c, f] = m.useState(((y = l[0]) == null ? void 0 : y.id) || null);
|
|
1170
|
+
m.useEffect(() => {
|
|
1171
|
+
const p = a.selectedChildId.ParentId, N = a.selectedChildId.ChildId;
|
|
1172
|
+
p === e.id && N && f(N);
|
|
1173
|
+
}, [a.selectedChildId.ParentId, a.selectedChildId.ChildId, e.id]), m.useEffect(() => {
|
|
1174
|
+
var p;
|
|
1175
|
+
f(((p = l[0]) == null ? void 0 : p.id) || null);
|
|
1176
|
+
}, [e.id]), m.useEffect(() => {
|
|
1177
|
+
if (!l.length) {
|
|
1178
|
+
c !== null && f(null);
|
|
1216
1179
|
return;
|
|
1217
1180
|
}
|
|
1218
|
-
|
|
1219
|
-
}, [
|
|
1220
|
-
|
|
1221
|
-
}, [
|
|
1222
|
-
const
|
|
1223
|
-
(
|
|
1224
|
-
|
|
1225
|
-
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
-
|
|
1229
|
-
(
|
|
1181
|
+
l.some((N) => N.id === c) || f(l[0].id);
|
|
1182
|
+
}, [l, c]), m.useEffect(() => {
|
|
1183
|
+
r == null || r(e.id, c || null);
|
|
1184
|
+
}, [e.id, c, r]);
|
|
1185
|
+
const u = m.useCallback(
|
|
1186
|
+
(p) => {
|
|
1187
|
+
f(p), a.selectedChildId.set(e.id, p);
|
|
1188
|
+
},
|
|
1189
|
+
[e.id, a.selectedChildId]
|
|
1190
|
+
), h = m.useCallback((p) => {
|
|
1191
|
+
var N, L;
|
|
1192
|
+
return ((N = p.question) == null ? void 0 : N.trim()) || ((L = de[p.fieldType]) == null ? void 0 : L.label) || "Untitled";
|
|
1193
|
+
}, []), v = m.useCallback(
|
|
1194
|
+
(p, N) => s.field.update(p, N),
|
|
1195
|
+
[s]
|
|
1196
|
+
), i = m.useMemo(
|
|
1197
|
+
() => l.find((p) => p.id === c) || null,
|
|
1198
|
+
[l, c]
|
|
1199
|
+
), A = Je((i == null ? void 0 : i.id) || "", e.id), T = i && A ? A : null, V = m.useCallback(
|
|
1200
|
+
(p, N) => {
|
|
1230
1201
|
if (i) {
|
|
1231
|
-
if (
|
|
1232
|
-
const
|
|
1233
|
-
if (!
|
|
1234
|
-
|
|
1202
|
+
if (p === "id") {
|
|
1203
|
+
const L = String(N ?? "").trim();
|
|
1204
|
+
if (!L) return;
|
|
1205
|
+
o.getState().updateField(
|
|
1235
1206
|
i.id,
|
|
1236
|
-
{ id:
|
|
1207
|
+
{ id: L },
|
|
1237
1208
|
{
|
|
1238
|
-
sectionId:
|
|
1239
|
-
onIdChange: (
|
|
1240
|
-
|
|
1209
|
+
sectionId: e.id,
|
|
1210
|
+
onIdChange: (W, B) => {
|
|
1211
|
+
f((U) => U === B ? W : U);
|
|
1241
1212
|
}
|
|
1242
1213
|
}
|
|
1243
1214
|
);
|
|
1244
1215
|
return;
|
|
1245
1216
|
}
|
|
1246
|
-
|
|
1217
|
+
o.getState().updateField(
|
|
1247
1218
|
i.id,
|
|
1248
|
-
{ [
|
|
1249
|
-
{ sectionId:
|
|
1219
|
+
{ [p]: N },
|
|
1220
|
+
{ sectionId: e.id }
|
|
1250
1221
|
);
|
|
1251
1222
|
}
|
|
1252
1223
|
},
|
|
1253
|
-
[i,
|
|
1254
|
-
),
|
|
1255
|
-
i &&
|
|
1256
|
-
}, [i,
|
|
1257
|
-
() => i && [
|
|
1224
|
+
[i, e.id, o]
|
|
1225
|
+
), j = m.useCallback(() => {
|
|
1226
|
+
i && o.getState().deleteField(i.id, { sectionId: e.id });
|
|
1227
|
+
}, [i, e.id, o]), E = m.useMemo(
|
|
1228
|
+
() => i && (de[i.fieldType] || {}).hasOptions || !1,
|
|
1229
|
+
[i]
|
|
1230
|
+
), O = m.useMemo(
|
|
1231
|
+
() => i && (de[i.fieldType] || {}).hasMatrix || !1,
|
|
1258
1232
|
[i]
|
|
1259
1233
|
);
|
|
1260
|
-
return /* @__PURE__ */ t.jsxs(
|
|
1261
|
-
/* @__PURE__ */ t.
|
|
1262
|
-
|
|
1263
|
-
Ze,
|
|
1264
|
-
{
|
|
1265
|
-
id: r.id,
|
|
1266
|
-
onCommit: (u) => a.field.renameId(u)
|
|
1267
|
-
}
|
|
1268
|
-
),
|
|
1269
|
-
/* @__PURE__ */ t.jsxs("div", { className: "mt-3", children: [
|
|
1270
|
-
/* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: "Section Title" }),
|
|
1234
|
+
return /* @__PURE__ */ t.jsxs("div", { className: "space-y-4", children: [
|
|
1235
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1236
|
+
/* @__PURE__ */ t.jsx("h3", { className: "text-sm font-semibold text-gray-700 uppercase tracking-wide", children: "Section Properties" }),
|
|
1271
1237
|
/* @__PURE__ */ t.jsx(
|
|
1272
|
-
|
|
1238
|
+
Ot,
|
|
1273
1239
|
{
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
onChange: (u) => x("title", u.target.value),
|
|
1277
|
-
placeholder: "Section title"
|
|
1240
|
+
id: e.id,
|
|
1241
|
+
onCommit: (p) => s.field.renameId(p)
|
|
1278
1242
|
}
|
|
1279
|
-
)
|
|
1243
|
+
),
|
|
1244
|
+
/* @__PURE__ */ t.jsxs("div", { className: "section-editor-title", children: [
|
|
1245
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Section Title" }),
|
|
1246
|
+
/* @__PURE__ */ t.jsx(
|
|
1247
|
+
"input",
|
|
1248
|
+
{
|
|
1249
|
+
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
|
+
value: e.title || "",
|
|
1251
|
+
onChange: (p) => v("title", p.target.value),
|
|
1252
|
+
placeholder: "e.g., Patient Information"
|
|
1253
|
+
}
|
|
1254
|
+
)
|
|
1255
|
+
] })
|
|
1280
1256
|
] }),
|
|
1281
|
-
/* @__PURE__ */ t.jsxs("div", { className: "
|
|
1282
|
-
/* @__PURE__ */ t.
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
|
|
1257
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1258
|
+
/* @__PURE__ */ t.jsxs("h3", { className: "text-sm font-semibold text-gray-700 uppercase tracking-wide", children: [
|
|
1259
|
+
"Fields (",
|
|
1260
|
+
l.length,
|
|
1261
|
+
")"
|
|
1262
|
+
] }),
|
|
1263
|
+
l.length === 0 ? /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center justify-center p-6 bg-gray-50 border-2 border-dashed border-gray-200 rounded-lg text-center", children: [
|
|
1264
|
+
/* @__PURE__ */ t.jsx("p", { className: "text-sm text-gray-500", children: "No fields in this section" }),
|
|
1265
|
+
/* @__PURE__ */ t.jsx("p", { className: "text-xs text-gray-400 mt-1", children: "Use the Tool Panel to add fields" })
|
|
1266
|
+
] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1267
|
+
/* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
|
|
1268
|
+
/* @__PURE__ */ t.jsx(
|
|
1269
|
+
"select",
|
|
1288
1270
|
{
|
|
1289
|
-
className:
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1271
|
+
className: "w-full px-3 py-2 pr-10 border border-gray-300 rounded bg-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none appearance-none cursor-pointer",
|
|
1272
|
+
value: c || "",
|
|
1273
|
+
onChange: (p) => u(p.target.value),
|
|
1274
|
+
children: l.map((p) => {
|
|
1275
|
+
var N;
|
|
1276
|
+
return /* @__PURE__ */ t.jsxs("option", { value: p.id, children: [
|
|
1277
|
+
h(p),
|
|
1278
|
+
" — ",
|
|
1279
|
+
(N = de[p.fieldType]) == null ? void 0 : N.label
|
|
1280
|
+
] }, p.id);
|
|
1281
|
+
})
|
|
1282
|
+
}
|
|
1283
|
+
),
|
|
1284
|
+
/* @__PURE__ */ t.jsx(wr, { className: "absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500 pointer-events-none" })
|
|
1285
|
+
] }),
|
|
1286
|
+
i && /* @__PURE__ */ t.jsxs("div", { className: "space-y-4 p-4 bg-gray-50 border border-gray-200 rounded-lg", children: [
|
|
1287
|
+
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
1288
|
+
/* @__PURE__ */ t.jsx("span", { className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800", children: ((S = de[i.fieldType]) == null ? void 0 : S.label) || i.fieldType }),
|
|
1289
|
+
/* @__PURE__ */ t.jsxs(
|
|
1290
|
+
"button",
|
|
1291
|
+
{
|
|
1292
|
+
className: "flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-red-600 hover:text-red-700 hover:bg-red-50 border border-red-300 rounded transition-colors",
|
|
1293
|
+
onClick: j,
|
|
1294
|
+
title: "Delete this field",
|
|
1295
|
+
children: [
|
|
1296
|
+
/* @__PURE__ */ t.jsx(ye, { className: "w-3.5 h-3.5" }),
|
|
1297
|
+
"Delete"
|
|
1298
|
+
]
|
|
1299
|
+
}
|
|
1300
|
+
)
|
|
1304
1301
|
] }),
|
|
1305
|
-
/* @__PURE__ */ t.jsx(
|
|
1306
|
-
i.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "
|
|
1307
|
-
/* @__PURE__ */ t.jsx("
|
|
1302
|
+
/* @__PURE__ */ t.jsx(St, { f: i, onUpdateField: V }),
|
|
1303
|
+
i.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "section-editor-default-answer", children: [
|
|
1304
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Default Answer" }),
|
|
1308
1305
|
/* @__PURE__ */ t.jsx(
|
|
1309
1306
|
"input",
|
|
1310
1307
|
{
|
|
1311
|
-
className: "w-full px-3 py-2 border border-
|
|
1308
|
+
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",
|
|
1312
1309
|
value: i.answer || "",
|
|
1313
|
-
onChange: (
|
|
1310
|
+
onChange: (p) => V("answer", p.target.value),
|
|
1314
1311
|
placeholder: "Default value"
|
|
1315
1312
|
}
|
|
1316
1313
|
)
|
|
1317
1314
|
] }),
|
|
1318
|
-
|
|
1319
|
-
/* @__PURE__ */ t.jsx(
|
|
1320
|
-
"button",
|
|
1321
|
-
{
|
|
1322
|
-
className: "mt-3 px-3 py-2 text-sm text-red-400 border rounded",
|
|
1323
|
-
onClick: g,
|
|
1324
|
-
children: "Delete this field"
|
|
1325
|
-
}
|
|
1326
|
-
)
|
|
1315
|
+
E && T && /* @__PURE__ */ t.jsx(It, { field: i, api: T }),
|
|
1316
|
+
O && T && /* @__PURE__ */ t.jsx(Rt, { field: i, api: T })
|
|
1327
1317
|
] })
|
|
1328
1318
|
] })
|
|
1329
1319
|
] })
|
|
1330
1320
|
] });
|
|
1331
1321
|
}
|
|
1332
|
-
function
|
|
1333
|
-
switch (
|
|
1322
|
+
function ht(e) {
|
|
1323
|
+
switch (e) {
|
|
1334
1324
|
case "input":
|
|
1335
1325
|
return ["equals", "contains"];
|
|
1336
1326
|
case "radio":
|
|
@@ -1342,400 +1332,1134 @@ function Be(r) {
|
|
|
1342
1332
|
return ["equals"];
|
|
1343
1333
|
}
|
|
1344
1334
|
}
|
|
1345
|
-
function
|
|
1346
|
-
if (
|
|
1347
|
-
const
|
|
1348
|
-
return { id:
|
|
1335
|
+
function pt(e) {
|
|
1336
|
+
if (e && typeof e == "object") {
|
|
1337
|
+
const s = e.id ?? String(e.value ?? ""), o = String(e.value ?? e.label ?? e.id ?? "");
|
|
1338
|
+
return { id: s, value: o };
|
|
1349
1339
|
}
|
|
1350
|
-
const
|
|
1351
|
-
return { id:
|
|
1352
|
-
}
|
|
1353
|
-
function
|
|
1354
|
-
var
|
|
1355
|
-
const
|
|
1356
|
-
(
|
|
1357
|
-
const
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
}, [
|
|
1361
|
-
if (
|
|
1362
|
-
if (
|
|
1363
|
-
const
|
|
1364
|
-
|
|
1340
|
+
const r = String(e ?? "");
|
|
1341
|
+
return { id: r, value: r };
|
|
1342
|
+
}
|
|
1343
|
+
function $r() {
|
|
1344
|
+
var te, ne, G;
|
|
1345
|
+
const e = ae(), r = re((x) => x.byId), s = re((x) => x.setEnableWhen), o = re((x) => x.updateField), a = ((te = e == null ? void 0 : e.selectedFieldId) == null ? void 0 : te.value) ?? null;
|
|
1346
|
+
(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 = a ? r[a] : 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((x) => x.id === l), [f, l, u]), v = m.useMemo(() => f && h ? `child:${l}` : "", [f, h, l]), [i, A] = m.useState(v);
|
|
1348
|
+
m.useEffect(() => {
|
|
1349
|
+
A(v);
|
|
1350
|
+
}, [v]), m.useEffect(() => {
|
|
1351
|
+
if (f)
|
|
1352
|
+
if (i && i.startsWith("child:")) {
|
|
1353
|
+
const x = i.slice(6);
|
|
1354
|
+
e.selectedChildId.set(a, x);
|
|
1365
1355
|
} else
|
|
1366
|
-
|
|
1367
|
-
}, [
|
|
1368
|
-
const
|
|
1369
|
-
var
|
|
1370
|
-
const
|
|
1371
|
-
for (const
|
|
1372
|
-
if (
|
|
1373
|
-
if (
|
|
1374
|
-
const
|
|
1375
|
-
|
|
1376
|
-
var
|
|
1377
|
-
|
|
1378
|
-
id:
|
|
1379
|
-
parentId:
|
|
1380
|
-
label: `${
|
|
1381
|
-
fieldType:
|
|
1382
|
-
options: Array.isArray(
|
|
1356
|
+
e.selectedChildId.set(null, null);
|
|
1357
|
+
}, [f, i, a, e]);
|
|
1358
|
+
const T = !!(f && i && i.startsWith("child:")), V = T ? i.slice(6) : null, j = T ? V : a, E = m.useMemo(() => j ? T ? u.find((x) => x.id === V) ?? null : r[j] ?? null : null, [r, j, T, V, u]), O = m.useMemo(() => {
|
|
1359
|
+
var g, w, q;
|
|
1360
|
+
const x = [];
|
|
1361
|
+
for (const F of Object.values(r))
|
|
1362
|
+
if (F)
|
|
1363
|
+
if (F.fieldType === "section" && Array.isArray(F.fields)) {
|
|
1364
|
+
const J = ((g = F.title) == null ? void 0 : g.trim()) || "Section";
|
|
1365
|
+
F.fields.forEach((I) => {
|
|
1366
|
+
var R;
|
|
1367
|
+
x.push({
|
|
1368
|
+
id: I.id,
|
|
1369
|
+
parentId: F.id,
|
|
1370
|
+
label: `${J} › ${((R = I.question) == null ? void 0 : R.trim()) || I.id}`,
|
|
1371
|
+
fieldType: I.fieldType,
|
|
1372
|
+
options: Array.isArray(I.options) ? I.options : []
|
|
1383
1373
|
});
|
|
1384
1374
|
});
|
|
1385
1375
|
} else
|
|
1386
|
-
|
|
1387
|
-
id:
|
|
1376
|
+
x.push({
|
|
1377
|
+
id: F.id,
|
|
1388
1378
|
parentId: null,
|
|
1389
|
-
label: ((
|
|
1390
|
-
fieldType:
|
|
1391
|
-
options: Array.isArray(
|
|
1379
|
+
label: ((w = F.question) == null ? void 0 : w.trim()) || ((q = F.title) == null ? void 0 : q.trim()) || F.id,
|
|
1380
|
+
fieldType: F.fieldType,
|
|
1381
|
+
options: Array.isArray(F.options) ? F.options : []
|
|
1392
1382
|
});
|
|
1393
|
-
return
|
|
1394
|
-
}, [
|
|
1395
|
-
(
|
|
1396
|
-
[
|
|
1397
|
-
),
|
|
1398
|
-
(
|
|
1399
|
-
if (!
|
|
1400
|
-
const
|
|
1401
|
-
|
|
1383
|
+
return x;
|
|
1384
|
+
}, [r]), y = m.useCallback(
|
|
1385
|
+
(x) => O.find((g) => g.id === x) || null,
|
|
1386
|
+
[O]
|
|
1387
|
+
), S = m.useCallback(
|
|
1388
|
+
(x) => {
|
|
1389
|
+
if (!j) return;
|
|
1390
|
+
const g = x && Array.isArray(x.conditions) ? { logic: x.logic || "AND", conditions: x.conditions } : void 0;
|
|
1391
|
+
T && a ? o(j, { enableWhen: g }, { sectionId: a }) : s(j, g);
|
|
1402
1392
|
},
|
|
1403
|
-
[
|
|
1404
|
-
),
|
|
1405
|
-
const
|
|
1406
|
-
logic:
|
|
1393
|
+
[j, T, a, s, o]
|
|
1394
|
+
), 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 x = {
|
|
1396
|
+
logic: p.logic || "AND",
|
|
1407
1397
|
conditions: [
|
|
1408
|
-
...Array.isArray(
|
|
1398
|
+
...Array.isArray(p.conditions) ? p.conditions : [],
|
|
1409
1399
|
{ targetId: "", operator: "equals", value: "" }
|
|
1410
1400
|
]
|
|
1411
1401
|
};
|
|
1412
|
-
|
|
1413
|
-
}, [
|
|
1414
|
-
(
|
|
1415
|
-
const
|
|
1416
|
-
|
|
1402
|
+
S(x);
|
|
1403
|
+
}, [p, S]), L = m.useCallback(() => S(null), [S]), W = m.useCallback(
|
|
1404
|
+
(x) => {
|
|
1405
|
+
const w = (Array.isArray(p.conditions) ? p.conditions : []).filter((q, F) => F !== x);
|
|
1406
|
+
S({ ...p, conditions: w });
|
|
1417
1407
|
},
|
|
1418
|
-
[
|
|
1419
|
-
),
|
|
1420
|
-
(
|
|
1421
|
-
const q = [...Array.isArray(
|
|
1422
|
-
if ("targetId" in
|
|
1423
|
-
const
|
|
1424
|
-
|
|
1425
|
-
const
|
|
1426
|
-
|
|
1408
|
+
[p, S]
|
|
1409
|
+
), B = m.useCallback(
|
|
1410
|
+
(x, g) => {
|
|
1411
|
+
const q = [...Array.isArray(p.conditions) ? p.conditions : []], J = { ...q[x] || { targetId: "", operator: "equals", value: "" }, ...g };
|
|
1412
|
+
if ("targetId" in g) {
|
|
1413
|
+
const I = y(J.targetId), R = ht(I == null ? void 0 : I.fieldType);
|
|
1414
|
+
R.includes(J.operator) || (J.operator = R[0] || "equals");
|
|
1415
|
+
const D = Array.isArray(I == null ? void 0 : I.options) ? I.options.map(pt) : [];
|
|
1416
|
+
D.length > 0 && (new Set(D.map((se) => se.id)).has(J.value) || (J.value = ""));
|
|
1427
1417
|
}
|
|
1428
|
-
q[
|
|
1418
|
+
q[x] = J, S({ ...p, conditions: q });
|
|
1429
1419
|
},
|
|
1430
|
-
[
|
|
1431
|
-
),
|
|
1432
|
-
() =>
|
|
1433
|
-
[
|
|
1434
|
-
),
|
|
1435
|
-
return /* @__PURE__ */ t.jsxs("div", { className: "space-y-
|
|
1436
|
-
|
|
1437
|
-
/* @__PURE__ */ t.jsx("label", { className: "text-sm", children: "Target
|
|
1420
|
+
[p, y, S]
|
|
1421
|
+
), U = m.useMemo(
|
|
1422
|
+
() => O.filter((x) => x.id !== j),
|
|
1423
|
+
[O, j]
|
|
1424
|
+
), k = !E || !j;
|
|
1425
|
+
return /* @__PURE__ */ t.jsxs("div", { className: "logic-editor-container space-y-4", children: [
|
|
1426
|
+
f && /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
|
|
1427
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Target Field" }),
|
|
1438
1428
|
/* @__PURE__ */ t.jsxs(
|
|
1439
1429
|
"select",
|
|
1440
1430
|
{
|
|
1441
|
-
className: "border
|
|
1442
|
-
value:
|
|
1443
|
-
onChange: (
|
|
1431
|
+
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
|
+
value: i,
|
|
1433
|
+
onChange: (x) => A(x.target.value),
|
|
1444
1434
|
children: [
|
|
1445
1435
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "Section (this)" }),
|
|
1446
|
-
|
|
1447
|
-
var
|
|
1448
|
-
return /* @__PURE__ */ t.jsx("option", { value: `child:${
|
|
1436
|
+
u.map((x) => {
|
|
1437
|
+
var g, w;
|
|
1438
|
+
return /* @__PURE__ */ t.jsx("option", { value: `child:${x.id}`, children: ((g = x.question) == null ? void 0 : g.trim()) || ((w = x.title) == null ? void 0 : w.trim()) || x.id }, x.id);
|
|
1449
1439
|
})
|
|
1450
1440
|
]
|
|
1451
1441
|
}
|
|
1452
1442
|
)
|
|
1453
1443
|
] }),
|
|
1454
|
-
/* @__PURE__ */ t.jsxs("div", { className: "
|
|
1455
|
-
/* @__PURE__ */ t.
|
|
1456
|
-
|
|
1457
|
-
"select",
|
|
1458
|
-
{
|
|
1459
|
-
value: S.logic || "AND",
|
|
1460
|
-
onChange: (f) => O({ ...S, logic: f.target.value }),
|
|
1461
|
-
className: "border p-1 rounded",
|
|
1462
|
-
disabled: V,
|
|
1463
|
-
children: [
|
|
1464
|
-
/* @__PURE__ */ t.jsx("option", { value: "AND", children: "AND" }),
|
|
1465
|
-
/* @__PURE__ */ t.jsx("option", { value: "OR", children: "OR" })
|
|
1466
|
-
]
|
|
1467
|
-
}
|
|
1468
|
-
),
|
|
1469
|
-
/* @__PURE__ */ t.jsx("button", { type: "button", className: "px-2 py-1 border rounded", onClick: ie, disabled: V, children: "+ Condition" }),
|
|
1470
|
-
/* @__PURE__ */ t.jsx("button", { type: "button", className: "px-2 py-1 border rounded", onClick: le, disabled: V, children: "Clear" })
|
|
1471
|
-
] }),
|
|
1472
|
-
(Array.isArray(S.conditions) ? S.conditions : []).map((f, I) => {
|
|
1473
|
-
const A = j(f.targetId), q = Be(A == null ? void 0 : A.fieldType), P = Array.isArray(A == null ? void 0 : A.options) ? A.options.map(Je) : [], W = P.length > 0;
|
|
1474
|
-
return /* @__PURE__ */ t.jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-7 gap-2 items-center opacity-100", children: [
|
|
1475
|
-
/* @__PURE__ */ t.jsx(
|
|
1476
|
-
"button",
|
|
1477
|
-
{
|
|
1478
|
-
type: "button",
|
|
1479
|
-
onClick: () => H(I),
|
|
1480
|
-
className: "px-2 py-1 border rounded sm:col-span-1",
|
|
1481
|
-
title: "Remove condition",
|
|
1482
|
-
disabled: V,
|
|
1483
|
-
children: "✕"
|
|
1484
|
-
}
|
|
1485
|
-
),
|
|
1444
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1445
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
|
|
1446
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Logic Operator" }),
|
|
1486
1447
|
/* @__PURE__ */ t.jsxs(
|
|
1487
1448
|
"select",
|
|
1488
1449
|
{
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
disabled:
|
|
1450
|
+
value: p.logic || "AND",
|
|
1451
|
+
onChange: (x) => S({ ...p, logic: x.target.value }),
|
|
1452
|
+
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
|
+
disabled: k,
|
|
1493
1454
|
children: [
|
|
1494
|
-
/* @__PURE__ */ t.jsx("option", { value: "", children: "—
|
|
1495
|
-
|
|
1455
|
+
/* @__PURE__ */ t.jsx("option", { value: "AND", children: "AND — All conditions must be true" }),
|
|
1456
|
+
/* @__PURE__ */ t.jsx("option", { value: "OR", children: "OR — Any condition must be true" })
|
|
1496
1457
|
]
|
|
1497
1458
|
}
|
|
1498
|
-
)
|
|
1459
|
+
)
|
|
1460
|
+
] }),
|
|
1461
|
+
/* @__PURE__ */ t.jsxs("div", { className: "flex gap-2", children: [
|
|
1499
1462
|
/* @__PURE__ */ t.jsx(
|
|
1500
|
-
"
|
|
1463
|
+
"button",
|
|
1501
1464
|
{
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
disabled:
|
|
1506
|
-
children:
|
|
1465
|
+
type: "button",
|
|
1466
|
+
className: "flex-1 px-3 py-2 text-sm font-medium text-blue-600 border border-blue-300 rounded-lg hover:bg-blue-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1467
|
+
onClick: N,
|
|
1468
|
+
disabled: k,
|
|
1469
|
+
children: "+ Add Condition"
|
|
1507
1470
|
}
|
|
1508
1471
|
),
|
|
1509
|
-
|
|
1510
|
-
"
|
|
1511
|
-
{
|
|
1512
|
-
className: "border p-1 rounded sm:col-span-2",
|
|
1513
|
-
value: f.value,
|
|
1514
|
-
onChange: (w) => Q(I, { value: w.target.value }),
|
|
1515
|
-
disabled: V || !A,
|
|
1516
|
-
children: [
|
|
1517
|
-
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select option —" }),
|
|
1518
|
-
P.map((w) => /* @__PURE__ */ t.jsx("option", { value: w.id, children: w.value }, w.id))
|
|
1519
|
-
]
|
|
1520
|
-
}
|
|
1521
|
-
) : /* @__PURE__ */ t.jsx(
|
|
1522
|
-
"input",
|
|
1472
|
+
/* @__PURE__ */ t.jsx(
|
|
1473
|
+
"button",
|
|
1523
1474
|
{
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1475
|
+
type: "button",
|
|
1476
|
+
className: "px-3 py-2 text-sm font-medium text-red-600 border border-red-300 rounded-lg hover:bg-red-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1477
|
+
onClick: L,
|
|
1478
|
+
disabled: k,
|
|
1479
|
+
children: "Clear All"
|
|
1529
1480
|
}
|
|
1530
1481
|
)
|
|
1531
|
-
] }
|
|
1532
|
-
})
|
|
1482
|
+
] })
|
|
1483
|
+
] }),
|
|
1484
|
+
p.conditions.length > 0 && /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
|
|
1485
|
+
/* @__PURE__ */ t.jsxs("h4", { className: "text-sm font-medium text-gray-700", children: [
|
|
1486
|
+
"Conditions (",
|
|
1487
|
+
p.conditions.length,
|
|
1488
|
+
")"
|
|
1489
|
+
] }),
|
|
1490
|
+
/* @__PURE__ */ t.jsx("div", { className: "space-y-3", children: p.conditions.map((x, g) => {
|
|
1491
|
+
const w = y(x.targetId), q = ht(w == null ? void 0 : w.fieldType), F = Array.isArray(w == null ? void 0 : w.options) ? w.options.map(pt) : [], J = F.length > 0;
|
|
1492
|
+
return /* @__PURE__ */ t.jsxs("div", { className: "p-3 bg-gray-50 border border-gray-200 rounded-lg space-y-2", children: [
|
|
1493
|
+
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
|
|
1494
|
+
/* @__PURE__ */ t.jsxs("span", { className: "text-xs font-semibold text-gray-500 uppercase tracking-wide", children: [
|
|
1495
|
+
"Condition ",
|
|
1496
|
+
g + 1
|
|
1497
|
+
] }),
|
|
1498
|
+
/* @__PURE__ */ t.jsx(
|
|
1499
|
+
"button",
|
|
1500
|
+
{
|
|
1501
|
+
type: "button",
|
|
1502
|
+
onClick: () => W(g),
|
|
1503
|
+
className: "text-gray-400 hover:text-red-600 transition-colors",
|
|
1504
|
+
title: "Remove condition",
|
|
1505
|
+
disabled: k,
|
|
1506
|
+
children: /* @__PURE__ */ t.jsx(ye, { className: "w-4 h-4" })
|
|
1507
|
+
}
|
|
1508
|
+
)
|
|
1509
|
+
] }),
|
|
1510
|
+
/* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
|
|
1511
|
+
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1512
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "When Field" }),
|
|
1513
|
+
/* @__PURE__ */ t.jsxs(
|
|
1514
|
+
"select",
|
|
1515
|
+
{
|
|
1516
|
+
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: x.targetId,
|
|
1518
|
+
onChange: (I) => B(g, { targetId: I.target.value }),
|
|
1519
|
+
disabled: k,
|
|
1520
|
+
children: [
|
|
1521
|
+
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select field —" }),
|
|
1522
|
+
U.map((I) => /* @__PURE__ */ t.jsx("option", { value: I.id, children: I.label }, I.id))
|
|
1523
|
+
]
|
|
1524
|
+
}
|
|
1525
|
+
)
|
|
1526
|
+
] }),
|
|
1527
|
+
/* @__PURE__ */ t.jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
|
|
1528
|
+
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1529
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "Operator" }),
|
|
1530
|
+
/* @__PURE__ */ t.jsx(
|
|
1531
|
+
"select",
|
|
1532
|
+
{
|
|
1533
|
+
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: x.operator,
|
|
1535
|
+
onChange: (I) => B(g, { operator: I.target.value }),
|
|
1536
|
+
disabled: k || !w,
|
|
1537
|
+
children: (w ? q : ["equals"]).map((I) => /* @__PURE__ */ t.jsx("option", { value: I, children: I }, I))
|
|
1538
|
+
}
|
|
1539
|
+
)
|
|
1540
|
+
] }),
|
|
1541
|
+
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1542
|
+
/* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "Value" }),
|
|
1543
|
+
J ? /* @__PURE__ */ t.jsxs(
|
|
1544
|
+
"select",
|
|
1545
|
+
{
|
|
1546
|
+
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: x.value,
|
|
1548
|
+
onChange: (I) => B(g, { value: I.target.value }),
|
|
1549
|
+
disabled: k || !w,
|
|
1550
|
+
children: [
|
|
1551
|
+
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select option —" }),
|
|
1552
|
+
F.map((I) => /* @__PURE__ */ t.jsx("option", { value: I.id, children: I.value }, I.id))
|
|
1553
|
+
]
|
|
1554
|
+
}
|
|
1555
|
+
) : /* @__PURE__ */ t.jsx(
|
|
1556
|
+
"input",
|
|
1557
|
+
{
|
|
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 text-sm",
|
|
1559
|
+
placeholder: "Enter value",
|
|
1560
|
+
value: x.value,
|
|
1561
|
+
onChange: (I) => B(g, { value: I.target.value }),
|
|
1562
|
+
disabled: k || !w
|
|
1563
|
+
}
|
|
1564
|
+
)
|
|
1565
|
+
] })
|
|
1566
|
+
] })
|
|
1567
|
+
] })
|
|
1568
|
+
] }, g);
|
|
1569
|
+
}) })
|
|
1570
|
+
] })
|
|
1533
1571
|
] });
|
|
1534
1572
|
}
|
|
1535
|
-
function
|
|
1536
|
-
const
|
|
1537
|
-
|
|
1538
|
-
(
|
|
1539
|
-
[
|
|
1573
|
+
function gt() {
|
|
1574
|
+
const e = ae(), r = re(
|
|
1575
|
+
m.useCallback(
|
|
1576
|
+
(f) => e.selectedFieldId.value ? f.byId[e.selectedFieldId.value] : null,
|
|
1577
|
+
[e.selectedFieldId.value]
|
|
1540
1578
|
)
|
|
1541
|
-
), [
|
|
1542
|
-
(
|
|
1543
|
-
|
|
1579
|
+
), [s, o] = m.useState("EDIT"), a = m.useCallback(
|
|
1580
|
+
(f, u) => {
|
|
1581
|
+
e.selectedChildId.set(f, u);
|
|
1544
1582
|
},
|
|
1545
|
-
[
|
|
1583
|
+
[e.selectedChildId.set]
|
|
1546
1584
|
);
|
|
1547
|
-
if (
|
|
1548
|
-
|
|
1549
|
-
}, [
|
|
1550
|
-
const
|
|
1585
|
+
if (m.useEffect(() => {
|
|
1586
|
+
e.selectedChildId.set(null, null), o("EDIT");
|
|
1587
|
+
}, [e.selectedFieldId.value]), e.state.isPreview) return null;
|
|
1588
|
+
const l = !r, c = (r == null ? void 0 : r.fieldType) === "section";
|
|
1551
1589
|
return /* @__PURE__ */ t.jsxs(
|
|
1552
1590
|
"div",
|
|
1553
1591
|
{
|
|
1554
|
-
className:
|
|
1555
|
-
${n ? "" : "max-h-32"} max-h-[calc(100svh-19rem)] lg:max-h-[calc(100dvh-15rem)]`,
|
|
1592
|
+
className: "edit-panel-container bg-white border border-gray-200 rounded-lg shadow-sm overflow-y-auto custom-scrollbar max-h-[calc(100svh-24rem)] lg:max-h-[calc(100dvh-20rem)]",
|
|
1556
1593
|
children: [
|
|
1557
|
-
/* @__PURE__ */ t.jsxs(
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
className: "sticky top-0 z-30 mb-4 inline-flex rounded-md border border-gray-200 overflow-hidden bg-white",
|
|
1561
|
-
role: "tablist",
|
|
1562
|
-
children: [
|
|
1563
|
-
/* @__PURE__ */ t.jsx(
|
|
1564
|
-
"button",
|
|
1565
|
-
{
|
|
1566
|
-
type: "button",
|
|
1567
|
-
onClick: () => c("EDIT"),
|
|
1568
|
-
"aria-selected": a === "EDIT",
|
|
1569
|
-
className: `px-3 py-1 text-sm ${a === "EDIT" ? "bg-gray-100 font-semibold" : "bg-white"}`,
|
|
1570
|
-
children: "EDIT"
|
|
1571
|
-
}
|
|
1572
|
-
),
|
|
1573
|
-
/* @__PURE__ */ t.jsx(
|
|
1574
|
-
"button",
|
|
1575
|
-
{
|
|
1576
|
-
type: "button",
|
|
1577
|
-
onClick: () => c("LOGIC"),
|
|
1578
|
-
"aria-selected": a === "LOGIC",
|
|
1579
|
-
className: `px-3 py-1 text-sm border-l border-gray-200 ${a === "LOGIC" ? "bg-gray-100 font-semibold" : "bg-white"}`,
|
|
1580
|
-
children: "LOGIC"
|
|
1581
|
-
}
|
|
1582
|
-
)
|
|
1583
|
-
]
|
|
1584
|
-
}
|
|
1585
|
-
),
|
|
1586
|
-
p && /* @__PURE__ */ t.jsxs("div", { className: "text-gray-600", children: [
|
|
1587
|
-
/* @__PURE__ */ t.jsx("h3", { className: "text-lg font-semibold mb-2", children: "Edit" }),
|
|
1588
|
-
/* @__PURE__ */ t.jsx("p", { children: "Select a field in the center panel to edit its properties." })
|
|
1589
|
-
] }),
|
|
1590
|
-
!p && a === "EDIT" && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1591
|
-
!b && /* @__PURE__ */ t.jsx(Qt, { f: n }),
|
|
1592
|
-
b && /* @__PURE__ */ t.jsx(
|
|
1593
|
-
Xt,
|
|
1594
|
+
/* @__PURE__ */ t.jsx("div", { className: "sticky top-0 z-20 bg-white border-b border-gray-200 px-4 pt-3 pb-2", children: /* @__PURE__ */ t.jsxs("div", { className: "flex gap-1 rounded-lg border border-black/10 bg-black/5 p-1 w-full", children: [
|
|
1595
|
+
/* @__PURE__ */ t.jsxs(
|
|
1596
|
+
"button",
|
|
1594
1597
|
{
|
|
1595
|
-
|
|
1596
|
-
|
|
1598
|
+
type: "button",
|
|
1599
|
+
onClick: () => o("EDIT"),
|
|
1600
|
+
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
|
+
children: [
|
|
1602
|
+
/* @__PURE__ */ t.jsx(Cr, { className: "w-4 h-4" }),
|
|
1603
|
+
/* @__PURE__ */ t.jsx("span", { children: "Edit" })
|
|
1604
|
+
]
|
|
1605
|
+
}
|
|
1606
|
+
),
|
|
1607
|
+
/* @__PURE__ */ t.jsxs(
|
|
1608
|
+
"button",
|
|
1609
|
+
{
|
|
1610
|
+
type: "button",
|
|
1611
|
+
onClick: () => o("LOGIC"),
|
|
1612
|
+
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
|
+
children: [
|
|
1614
|
+
/* @__PURE__ */ t.jsx(Er, { className: "w-4 h-4" }),
|
|
1615
|
+
/* @__PURE__ */ t.jsx("span", { children: "Logic" })
|
|
1616
|
+
]
|
|
1597
1617
|
}
|
|
1598
1618
|
)
|
|
1599
|
-
] }),
|
|
1600
|
-
|
|
1619
|
+
] }) }),
|
|
1620
|
+
/* @__PURE__ */ t.jsxs("div", { className: "p-4", children: [
|
|
1621
|
+
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
|
+
!l && s === "EDIT" && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
1623
|
+
!c && /* @__PURE__ */ t.jsx(Dr, { f: r }),
|
|
1624
|
+
c && /* @__PURE__ */ t.jsx(
|
|
1625
|
+
Lr,
|
|
1626
|
+
{
|
|
1627
|
+
section: r,
|
|
1628
|
+
onActiveChildChange: a
|
|
1629
|
+
}
|
|
1630
|
+
)
|
|
1631
|
+
] }),
|
|
1632
|
+
!l && s === "LOGIC" && /* @__PURE__ */ t.jsx($r, {})
|
|
1633
|
+
] })
|
|
1601
1634
|
]
|
|
1602
1635
|
}
|
|
1603
1636
|
);
|
|
1604
1637
|
}
|
|
1605
|
-
function
|
|
1606
|
-
const
|
|
1607
|
-
return
|
|
1638
|
+
function Wr() {
|
|
1639
|
+
const e = ae(), { fields: r } = Nr(e.state.isPreview), s = Or((f) => f.hideUnsupportedFields), o = re((f) => f.order), a = m.useRef(null), l = m.useRef(0), c = Ye(() => (s ? r.filter((u) => u.fieldType !== "unsupported") : r).map((u) => u.id), [r, s]);
|
|
1640
|
+
return m.useEffect(() => {
|
|
1641
|
+
var f;
|
|
1642
|
+
if (!e.state.isPreview) {
|
|
1643
|
+
if (o.length > l.current) {
|
|
1644
|
+
const u = o[o.length - 1], h = (f = a.current) == null ? void 0 : f.querySelector(`[data-field-id="${u}"]`);
|
|
1645
|
+
h && (h.scrollIntoView({ behavior: "smooth", block: "nearest" }), e.selectedFieldId.set(u));
|
|
1646
|
+
}
|
|
1647
|
+
l.current = o.length;
|
|
1648
|
+
}
|
|
1649
|
+
}, [o, e.selectedFieldId, e.state.isPreview]), /* @__PURE__ */ t.jsx(
|
|
1608
1650
|
"div",
|
|
1609
1651
|
{
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1652
|
+
ref: a,
|
|
1653
|
+
className: `form-builder-main
|
|
1654
|
+
${e.state.isPreview ? "max-w-4xl" : "max-w-xl"}
|
|
1655
|
+
mx-auto rounded-lg overflow-y-auto max-h-[calc(100svh-13rem)] lg:max-h-[calc(100dvh-11rem)] custom-scrollbar lg:pr-2`,
|
|
1656
|
+
onClick: () => !e.state.isPreview && e.selectedFieldId.clear(),
|
|
1657
|
+
children: c.length === 0 ? /* @__PURE__ */ t.jsx(Ur, {}) : c.map((f) => /* @__PURE__ */ t.jsx(Vr, { id: f }, f))
|
|
1613
1658
|
}
|
|
1614
1659
|
);
|
|
1615
1660
|
}
|
|
1616
|
-
const
|
|
1617
|
-
const
|
|
1618
|
-
if (!
|
|
1619
|
-
const
|
|
1620
|
-
return
|
|
1661
|
+
const Vr = m.memo(function({ id: r }) {
|
|
1662
|
+
const s = re(m.useCallback((a) => a.byId[r], [r]));
|
|
1663
|
+
if (!s) return null;
|
|
1664
|
+
const o = Sr(s.fieldType);
|
|
1665
|
+
return o ? /* @__PURE__ */ t.jsx("div", { className: "mb-1.5", "data-field-type": s.fieldType, "data-field-id": s.id, children: /* @__PURE__ */ t.jsx(o, { field: s }) }) : null;
|
|
1621
1666
|
});
|
|
1622
|
-
function
|
|
1623
|
-
return /* @__PURE__ */ t.jsxs(
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1667
|
+
function Ur() {
|
|
1668
|
+
return /* @__PURE__ */ t.jsxs(
|
|
1669
|
+
"div",
|
|
1670
|
+
{
|
|
1671
|
+
className: `form-builder-empty-state flex flex-col\r
|
|
1672
|
+
items-center justify-center h-72 bg-gradient-to-br from-gray-50 \r
|
|
1673
|
+
to-gray-100 border-2 border-dashed border-blue-200 rounded-xl \r
|
|
1674
|
+
shadow-md text-center px-8 py-10`,
|
|
1675
|
+
children: [
|
|
1676
|
+
/* @__PURE__ */ t.jsx("div", { className: "empty-state-title text-xl font-semibold text-gray-700 mb-2", children: "Forms" }),
|
|
1677
|
+
/* @__PURE__ */ t.jsxs("div", { className: "empty-state-description text-base text-gray-500", children: [
|
|
1678
|
+
/* @__PURE__ */ t.jsxs("div", { className: "lg:hidden", children: [
|
|
1679
|
+
"Tap the ",
|
|
1680
|
+
/* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Tool Panel" }),
|
|
1681
|
+
" button to add fields."
|
|
1682
|
+
] }),
|
|
1683
|
+
/* @__PURE__ */ t.jsxs("div", { className: "hidden lg:block", children: [
|
|
1684
|
+
"Add fields using the ",
|
|
1685
|
+
/* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Tool Panel" }),
|
|
1686
|
+
" on the left.",
|
|
1687
|
+
/* @__PURE__ */ t.jsx("br", {}),
|
|
1688
|
+
"Edit field properties using the ",
|
|
1689
|
+
/* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Edit Panel" }),
|
|
1690
|
+
" on the right."
|
|
1691
|
+
] })
|
|
1692
|
+
] })
|
|
1693
|
+
]
|
|
1694
|
+
}
|
|
1695
|
+
);
|
|
1635
1696
|
}
|
|
1636
|
-
function
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
|
|
1648
|
-
|
|
1697
|
+
function bt(e, r) {
|
|
1698
|
+
(r == null || r > e.length) && (r = e.length);
|
|
1699
|
+
for (var s = 0, o = Array(r); s < r; s++) o[s] = e[s];
|
|
1700
|
+
return o;
|
|
1701
|
+
}
|
|
1702
|
+
function qr(e) {
|
|
1703
|
+
if (Array.isArray(e)) return e;
|
|
1704
|
+
}
|
|
1705
|
+
function zr(e, r, s) {
|
|
1706
|
+
return (r = Xr(r)) in e ? Object.defineProperty(e, r, {
|
|
1707
|
+
value: s,
|
|
1708
|
+
enumerable: !0,
|
|
1709
|
+
configurable: !0,
|
|
1710
|
+
writable: !0
|
|
1711
|
+
}) : e[r] = s, e;
|
|
1712
|
+
}
|
|
1713
|
+
function Yr(e, r) {
|
|
1714
|
+
var s = e == null ? null : typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
|
|
1715
|
+
if (s != null) {
|
|
1716
|
+
var o, a, l, c, f = [], u = !0, h = !1;
|
|
1717
|
+
try {
|
|
1718
|
+
if (l = (s = s.call(e)).next, r !== 0) for (; !(u = (o = l.call(s)).done) && (f.push(o.value), f.length !== r); u = !0) ;
|
|
1719
|
+
} catch (v) {
|
|
1720
|
+
h = !0, a = v;
|
|
1721
|
+
} finally {
|
|
1722
|
+
try {
|
|
1723
|
+
if (!u && s.return != null && (c = s.return(), Object(c) !== c)) return;
|
|
1724
|
+
} finally {
|
|
1725
|
+
if (h) throw a;
|
|
1726
|
+
}
|
|
1727
|
+
}
|
|
1728
|
+
return f;
|
|
1729
|
+
}
|
|
1730
|
+
}
|
|
1731
|
+
function Jr() {
|
|
1732
|
+
throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
1733
|
+
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
|
|
1734
|
+
}
|
|
1735
|
+
function xt(e, r) {
|
|
1736
|
+
var s = Object.keys(e);
|
|
1737
|
+
if (Object.getOwnPropertySymbols) {
|
|
1738
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
1739
|
+
r && (o = o.filter(function(a) {
|
|
1740
|
+
return Object.getOwnPropertyDescriptor(e, a).enumerable;
|
|
1741
|
+
})), s.push.apply(s, o);
|
|
1742
|
+
}
|
|
1743
|
+
return s;
|
|
1744
|
+
}
|
|
1745
|
+
function vt(e) {
|
|
1746
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
1747
|
+
var s = arguments[r] != null ? arguments[r] : {};
|
|
1748
|
+
r % 2 ? xt(Object(s), !0).forEach(function(o) {
|
|
1749
|
+
zr(e, o, s[o]);
|
|
1750
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) : xt(Object(s)).forEach(function(o) {
|
|
1751
|
+
Object.defineProperty(e, o, Object.getOwnPropertyDescriptor(s, o));
|
|
1752
|
+
});
|
|
1753
|
+
}
|
|
1754
|
+
return e;
|
|
1755
|
+
}
|
|
1756
|
+
function Br(e, r) {
|
|
1757
|
+
if (e == null) return {};
|
|
1758
|
+
var s, o, a = Hr(e, r);
|
|
1759
|
+
if (Object.getOwnPropertySymbols) {
|
|
1760
|
+
var l = Object.getOwnPropertySymbols(e);
|
|
1761
|
+
for (o = 0; o < l.length; o++) s = l[o], r.indexOf(s) === -1 && {}.propertyIsEnumerable.call(e, s) && (a[s] = e[s]);
|
|
1762
|
+
}
|
|
1763
|
+
return a;
|
|
1764
|
+
}
|
|
1765
|
+
function Hr(e, r) {
|
|
1766
|
+
if (e == null) return {};
|
|
1767
|
+
var s = {};
|
|
1768
|
+
for (var o in e) if ({}.hasOwnProperty.call(e, o)) {
|
|
1769
|
+
if (r.indexOf(o) !== -1) continue;
|
|
1770
|
+
s[o] = e[o];
|
|
1771
|
+
}
|
|
1772
|
+
return s;
|
|
1773
|
+
}
|
|
1774
|
+
function Kr(e, r) {
|
|
1775
|
+
return qr(e) || Yr(e, r) || Qr(e, r) || Jr();
|
|
1776
|
+
}
|
|
1777
|
+
function Gr(e, r) {
|
|
1778
|
+
if (typeof e != "object" || !e) return e;
|
|
1779
|
+
var s = e[Symbol.toPrimitive];
|
|
1780
|
+
if (s !== void 0) {
|
|
1781
|
+
var o = s.call(e, r);
|
|
1782
|
+
if (typeof o != "object") return o;
|
|
1783
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
1784
|
+
}
|
|
1785
|
+
return (r === "string" ? String : Number)(e);
|
|
1786
|
+
}
|
|
1787
|
+
function Xr(e) {
|
|
1788
|
+
var r = Gr(e, "string");
|
|
1789
|
+
return typeof r == "symbol" ? r : r + "";
|
|
1790
|
+
}
|
|
1791
|
+
function Qr(e, r) {
|
|
1792
|
+
if (e) {
|
|
1793
|
+
if (typeof e == "string") return bt(e, r);
|
|
1794
|
+
var s = {}.toString.call(e).slice(8, -1);
|
|
1795
|
+
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
|
+
}
|
|
1797
|
+
}
|
|
1798
|
+
function Zr(e, r, s) {
|
|
1799
|
+
return r in e ? Object.defineProperty(e, r, {
|
|
1800
|
+
value: s,
|
|
1801
|
+
enumerable: !0,
|
|
1802
|
+
configurable: !0,
|
|
1803
|
+
writable: !0
|
|
1804
|
+
}) : e[r] = s, e;
|
|
1805
|
+
}
|
|
1806
|
+
function yt(e, r) {
|
|
1807
|
+
var s = Object.keys(e);
|
|
1808
|
+
if (Object.getOwnPropertySymbols) {
|
|
1809
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
1810
|
+
r && (o = o.filter(function(a) {
|
|
1811
|
+
return Object.getOwnPropertyDescriptor(e, a).enumerable;
|
|
1812
|
+
})), s.push.apply(s, o);
|
|
1813
|
+
}
|
|
1814
|
+
return s;
|
|
1815
|
+
}
|
|
1816
|
+
function jt(e) {
|
|
1817
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
1818
|
+
var s = arguments[r] != null ? arguments[r] : {};
|
|
1819
|
+
r % 2 ? yt(Object(s), !0).forEach(function(o) {
|
|
1820
|
+
Zr(e, o, s[o]);
|
|
1821
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(s)) : yt(Object(s)).forEach(function(o) {
|
|
1822
|
+
Object.defineProperty(e, o, Object.getOwnPropertyDescriptor(s, o));
|
|
1823
|
+
});
|
|
1824
|
+
}
|
|
1825
|
+
return e;
|
|
1826
|
+
}
|
|
1827
|
+
function en() {
|
|
1828
|
+
for (var e = arguments.length, r = new Array(e), s = 0; s < e; s++)
|
|
1829
|
+
r[s] = arguments[s];
|
|
1830
|
+
return function(o) {
|
|
1831
|
+
return r.reduceRight(function(a, l) {
|
|
1832
|
+
return l(a);
|
|
1833
|
+
}, o);
|
|
1834
|
+
};
|
|
1835
|
+
}
|
|
1836
|
+
function xe(e) {
|
|
1837
|
+
return function r() {
|
|
1838
|
+
for (var s = this, o = arguments.length, a = new Array(o), l = 0; l < o; l++)
|
|
1839
|
+
a[l] = arguments[l];
|
|
1840
|
+
return a.length >= e.length ? e.apply(this, a) : function() {
|
|
1841
|
+
for (var c = arguments.length, f = new Array(c), u = 0; u < c; u++)
|
|
1842
|
+
f[u] = arguments[u];
|
|
1843
|
+
return r.apply(s, [].concat(a, f));
|
|
1844
|
+
};
|
|
1845
|
+
};
|
|
1846
|
+
}
|
|
1847
|
+
function Pe(e) {
|
|
1848
|
+
return {}.toString.call(e).includes("Object");
|
|
1849
|
+
}
|
|
1850
|
+
function tn(e) {
|
|
1851
|
+
return !Object.keys(e).length;
|
|
1852
|
+
}
|
|
1853
|
+
function je(e) {
|
|
1854
|
+
return typeof e == "function";
|
|
1855
|
+
}
|
|
1856
|
+
function rn(e, r) {
|
|
1857
|
+
return Object.prototype.hasOwnProperty.call(e, r);
|
|
1858
|
+
}
|
|
1859
|
+
function nn(e, r) {
|
|
1860
|
+
return Pe(r) || le("changeType"), Object.keys(r).some(function(s) {
|
|
1861
|
+
return !rn(e, s);
|
|
1862
|
+
}) && le("changeField"), r;
|
|
1863
|
+
}
|
|
1864
|
+
function sn(e) {
|
|
1865
|
+
je(e) || le("selectorType");
|
|
1866
|
+
}
|
|
1867
|
+
function on(e) {
|
|
1868
|
+
je(e) || Pe(e) || le("handlerType"), Pe(e) && Object.values(e).some(function(r) {
|
|
1869
|
+
return !je(r);
|
|
1870
|
+
}) && le("handlersType");
|
|
1871
|
+
}
|
|
1872
|
+
function an(e) {
|
|
1873
|
+
e || le("initialIsRequired"), Pe(e) || le("initialType"), tn(e) && le("initialContent");
|
|
1874
|
+
}
|
|
1875
|
+
function ln(e, r) {
|
|
1876
|
+
throw new Error(e[r] || e.default);
|
|
1877
|
+
}
|
|
1878
|
+
var cn = {
|
|
1879
|
+
initialIsRequired: "initial state is required",
|
|
1880
|
+
initialType: "initial state should be an object",
|
|
1881
|
+
initialContent: "initial state shouldn't be an empty object",
|
|
1882
|
+
handlerType: "handler should be an object or a function",
|
|
1883
|
+
handlersType: "all handlers should be a functions",
|
|
1884
|
+
selectorType: "selector should be a function",
|
|
1885
|
+
changeType: "provided value of changes should be an object",
|
|
1886
|
+
changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
|
|
1887
|
+
default: "an unknown error accured in `state-local` package"
|
|
1888
|
+
}, le = xe(ln)(cn), Ie = {
|
|
1889
|
+
changes: nn,
|
|
1890
|
+
selector: sn,
|
|
1891
|
+
handler: on,
|
|
1892
|
+
initial: an
|
|
1893
|
+
};
|
|
1894
|
+
function dn(e) {
|
|
1895
|
+
var r = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
|
|
1896
|
+
Ie.initial(e), Ie.handler(r);
|
|
1897
|
+
var s = {
|
|
1898
|
+
current: e
|
|
1899
|
+
}, o = xe(mn)(s, r), a = xe(fn)(s), l = xe(Ie.changes)(e), c = xe(un)(s);
|
|
1900
|
+
function f() {
|
|
1901
|
+
var h = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(v) {
|
|
1902
|
+
return v;
|
|
1903
|
+
};
|
|
1904
|
+
return Ie.selector(h), h(s.current);
|
|
1905
|
+
}
|
|
1906
|
+
function u(h) {
|
|
1907
|
+
en(o, a, l, c)(h);
|
|
1908
|
+
}
|
|
1909
|
+
return [f, u];
|
|
1910
|
+
}
|
|
1911
|
+
function un(e, r) {
|
|
1912
|
+
return je(r) ? r(e.current) : r;
|
|
1913
|
+
}
|
|
1914
|
+
function fn(e, r) {
|
|
1915
|
+
return e.current = jt(jt({}, e.current), r), r;
|
|
1916
|
+
}
|
|
1917
|
+
function mn(e, r, s) {
|
|
1918
|
+
return je(r) ? r(e.current) : Object.keys(s).forEach(function(o) {
|
|
1919
|
+
var a;
|
|
1920
|
+
return (a = r[o]) === null || a === void 0 ? void 0 : a.call(r, e.current[o]);
|
|
1921
|
+
}), s;
|
|
1922
|
+
}
|
|
1923
|
+
var hn = {
|
|
1924
|
+
create: dn
|
|
1925
|
+
}, pn = {
|
|
1926
|
+
paths: {
|
|
1927
|
+
vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.54.0/min/vs"
|
|
1928
|
+
}
|
|
1929
|
+
};
|
|
1930
|
+
function gn(e) {
|
|
1931
|
+
return function r() {
|
|
1932
|
+
for (var s = this, o = arguments.length, a = new Array(o), l = 0; l < o; l++)
|
|
1933
|
+
a[l] = arguments[l];
|
|
1934
|
+
return a.length >= e.length ? e.apply(this, a) : function() {
|
|
1935
|
+
for (var c = arguments.length, f = new Array(c), u = 0; u < c; u++)
|
|
1936
|
+
f[u] = arguments[u];
|
|
1937
|
+
return r.apply(s, [].concat(a, f));
|
|
1938
|
+
};
|
|
1939
|
+
};
|
|
1940
|
+
}
|
|
1941
|
+
function bn(e) {
|
|
1942
|
+
return {}.toString.call(e).includes("Object");
|
|
1943
|
+
}
|
|
1944
|
+
function xn(e) {
|
|
1945
|
+
return e || wt("configIsRequired"), bn(e) || wt("configType"), e.urls ? (vn(), {
|
|
1946
|
+
paths: {
|
|
1947
|
+
vs: e.urls.monacoBase
|
|
1948
|
+
}
|
|
1949
|
+
}) : e;
|
|
1950
|
+
}
|
|
1951
|
+
function vn() {
|
|
1952
|
+
console.warn(Tt.deprecation);
|
|
1953
|
+
}
|
|
1954
|
+
function yn(e, r) {
|
|
1955
|
+
throw new Error(e[r] || e.default);
|
|
1956
|
+
}
|
|
1957
|
+
var Tt = {
|
|
1958
|
+
configIsRequired: "the configuration object is required",
|
|
1959
|
+
configType: "the configuration object should be an object",
|
|
1960
|
+
default: "an unknown error accured in `@monaco-editor/loader` package",
|
|
1961
|
+
deprecation: `Deprecation warning!
|
|
1962
|
+
You are using deprecated way of configuration.
|
|
1963
|
+
|
|
1964
|
+
Instead of using
|
|
1965
|
+
monaco.config({ urls: { monacoBase: '...' } })
|
|
1966
|
+
use
|
|
1967
|
+
monaco.config({ paths: { vs: '...' } })
|
|
1968
|
+
|
|
1969
|
+
For more please check the link https://github.com/suren-atoyan/monaco-loader#config
|
|
1970
|
+
`
|
|
1971
|
+
}, wt = gn(yn)(Tt), jn = {
|
|
1972
|
+
config: xn
|
|
1973
|
+
}, wn = function() {
|
|
1974
|
+
for (var r = arguments.length, s = new Array(r), o = 0; o < r; o++)
|
|
1975
|
+
s[o] = arguments[o];
|
|
1976
|
+
return function(a) {
|
|
1977
|
+
return s.reduceRight(function(l, c) {
|
|
1978
|
+
return c(l);
|
|
1979
|
+
}, a);
|
|
1980
|
+
};
|
|
1981
|
+
};
|
|
1982
|
+
function kt(e, r) {
|
|
1983
|
+
return Object.keys(r).forEach(function(s) {
|
|
1984
|
+
r[s] instanceof Object && e[s] && Object.assign(r[s], kt(e[s], r[s]));
|
|
1985
|
+
}), vt(vt({}, e), r);
|
|
1986
|
+
}
|
|
1987
|
+
var Cn = {
|
|
1988
|
+
type: "cancelation",
|
|
1989
|
+
msg: "operation is manually canceled"
|
|
1990
|
+
};
|
|
1991
|
+
function Ue(e) {
|
|
1992
|
+
var r = !1, s = new Promise(function(o, a) {
|
|
1993
|
+
e.then(function(l) {
|
|
1994
|
+
return r ? a(Cn) : o(l);
|
|
1995
|
+
}), e.catch(a);
|
|
1996
|
+
});
|
|
1997
|
+
return s.cancel = function() {
|
|
1998
|
+
return r = !0;
|
|
1999
|
+
}, s;
|
|
2000
|
+
}
|
|
2001
|
+
var En = ["monaco"], Nn = hn.create({
|
|
2002
|
+
config: pn,
|
|
2003
|
+
isInitialized: !1,
|
|
2004
|
+
resolve: null,
|
|
2005
|
+
reject: null,
|
|
2006
|
+
monaco: null
|
|
2007
|
+
}), Pt = Kr(Nn, 2), we = Pt[0], _e = Pt[1];
|
|
2008
|
+
function On(e) {
|
|
2009
|
+
var r = jn.config(e), s = r.monaco, o = Br(r, En);
|
|
2010
|
+
_e(function(a) {
|
|
2011
|
+
return {
|
|
2012
|
+
config: kt(a.config, o),
|
|
2013
|
+
monaco: s
|
|
2014
|
+
};
|
|
2015
|
+
});
|
|
2016
|
+
}
|
|
2017
|
+
function Sn() {
|
|
2018
|
+
var e = we(function(r) {
|
|
2019
|
+
var s = r.monaco, o = r.isInitialized, a = r.resolve;
|
|
2020
|
+
return {
|
|
2021
|
+
monaco: s,
|
|
2022
|
+
isInitialized: o,
|
|
2023
|
+
resolve: a
|
|
2024
|
+
};
|
|
2025
|
+
});
|
|
2026
|
+
if (!e.isInitialized) {
|
|
2027
|
+
if (_e({
|
|
2028
|
+
isInitialized: !0
|
|
2029
|
+
}), e.monaco)
|
|
2030
|
+
return e.resolve(e.monaco), Ue(qe);
|
|
2031
|
+
if (window.monaco && window.monaco.editor)
|
|
2032
|
+
return _t(window.monaco), e.resolve(window.monaco), Ue(qe);
|
|
2033
|
+
wn(In, Tn)(kn);
|
|
2034
|
+
}
|
|
2035
|
+
return Ue(qe);
|
|
2036
|
+
}
|
|
2037
|
+
function In(e) {
|
|
2038
|
+
return document.body.appendChild(e);
|
|
2039
|
+
}
|
|
2040
|
+
function Rn(e) {
|
|
2041
|
+
var r = document.createElement("script");
|
|
2042
|
+
return e && (r.src = e), r;
|
|
2043
|
+
}
|
|
2044
|
+
function Tn(e) {
|
|
2045
|
+
var r = we(function(o) {
|
|
2046
|
+
var a = o.config, l = o.reject;
|
|
2047
|
+
return {
|
|
2048
|
+
config: a,
|
|
2049
|
+
reject: l
|
|
2050
|
+
};
|
|
2051
|
+
}), s = Rn("".concat(r.config.paths.vs, "/loader.js"));
|
|
2052
|
+
return s.onload = function() {
|
|
2053
|
+
return e();
|
|
2054
|
+
}, s.onerror = r.reject, s;
|
|
2055
|
+
}
|
|
2056
|
+
function kn() {
|
|
2057
|
+
var e = we(function(s) {
|
|
2058
|
+
var o = s.config, a = s.resolve, l = s.reject;
|
|
2059
|
+
return {
|
|
2060
|
+
config: o,
|
|
2061
|
+
resolve: a,
|
|
2062
|
+
reject: l
|
|
2063
|
+
};
|
|
2064
|
+
}), r = window.require;
|
|
2065
|
+
r.config(e.config), r(["vs/editor/editor.main"], function(s) {
|
|
2066
|
+
var o = s.m;
|
|
2067
|
+
_t(o), e.resolve(o);
|
|
2068
|
+
}, function(s) {
|
|
2069
|
+
e.reject(s);
|
|
2070
|
+
});
|
|
2071
|
+
}
|
|
2072
|
+
function _t(e) {
|
|
2073
|
+
we().monaco || _e({
|
|
2074
|
+
monaco: e
|
|
2075
|
+
});
|
|
2076
|
+
}
|
|
2077
|
+
function Pn() {
|
|
2078
|
+
return we(function(e) {
|
|
2079
|
+
var r = e.monaco;
|
|
2080
|
+
return r;
|
|
2081
|
+
});
|
|
2082
|
+
}
|
|
2083
|
+
var qe = new Promise(function(e, r) {
|
|
2084
|
+
return _e({
|
|
2085
|
+
resolve: e,
|
|
2086
|
+
reject: r
|
|
2087
|
+
});
|
|
2088
|
+
}), At = {
|
|
2089
|
+
config: On,
|
|
2090
|
+
init: Sn,
|
|
2091
|
+
__getMonacoInstance: Pn
|
|
2092
|
+
}, _n = { wrapper: { display: "flex", position: "relative", textAlign: "initial" }, fullWidth: { width: "100%" }, hide: { display: "none" } }, ze = _n, An = { container: { display: "flex", height: "100%", width: "100%", justifyContent: "center", alignItems: "center" } }, Mn = An;
|
|
2093
|
+
function Fn({ children: e }) {
|
|
2094
|
+
return m.createElement("div", { style: Mn.container }, e);
|
|
2095
|
+
}
|
|
2096
|
+
var Dn = Fn, Ln = Dn;
|
|
2097
|
+
function $n({ width: e, height: r, isEditorReady: s, loading: o, _ref: a, className: l, wrapperProps: c }) {
|
|
2098
|
+
return m.createElement("section", { style: { ...ze.wrapper, width: e, height: r }, ...c }, !s && m.createElement(Ln, null, o), m.createElement("div", { ref: a, style: { ...ze.fullWidth, ...!s && ze.hide }, className: l }));
|
|
2099
|
+
}
|
|
2100
|
+
var Wn = $n, Mt = Be(Wn);
|
|
2101
|
+
function Vn(e) {
|
|
2102
|
+
oe(e, []);
|
|
2103
|
+
}
|
|
2104
|
+
var Ft = Vn;
|
|
2105
|
+
function Un(e, r, s = !0) {
|
|
2106
|
+
let o = K(!0);
|
|
2107
|
+
oe(o.current || !s ? () => {
|
|
2108
|
+
o.current = !1;
|
|
2109
|
+
} : e, r);
|
|
2110
|
+
}
|
|
2111
|
+
var Z = Un;
|
|
2112
|
+
function ve() {
|
|
2113
|
+
}
|
|
2114
|
+
function me(e, r, s, o) {
|
|
2115
|
+
return qn(e, o) || zn(e, r, s, o);
|
|
2116
|
+
}
|
|
2117
|
+
function qn(e, r) {
|
|
2118
|
+
return e.editor.getModel(Dt(e, r));
|
|
2119
|
+
}
|
|
2120
|
+
function zn(e, r, s, o) {
|
|
2121
|
+
return e.editor.createModel(r, s, o ? Dt(e, o) : void 0);
|
|
2122
|
+
}
|
|
2123
|
+
function Dt(e, r) {
|
|
2124
|
+
return e.Uri.parse(r);
|
|
2125
|
+
}
|
|
2126
|
+
function Yn({ original: e, modified: r, language: s, originalLanguage: o, modifiedLanguage: a, originalModelPath: l, modifiedModelPath: c, keepCurrentOriginalModel: f = !1, keepCurrentModifiedModel: u = !1, theme: h = "light", loading: v = "Loading...", options: i = {}, height: A = "100%", width: T = "100%", className: V, wrapperProps: j = {}, beforeMount: E = ve, onMount: O = ve }) {
|
|
2127
|
+
let [y, S] = ke(!1), [p, N] = ke(!0), L = K(null), W = K(null), B = K(null), U = K(O), k = K(E), te = K(!1);
|
|
2128
|
+
Ft(() => {
|
|
2129
|
+
let g = At.init();
|
|
2130
|
+
return g.then((w) => (W.current = w) && N(!1)).catch((w) => (w == null ? void 0 : w.type) !== "cancelation" && console.error("Monaco initialization: error:", w)), () => L.current ? x() : g.cancel();
|
|
2131
|
+
}), Z(() => {
|
|
2132
|
+
if (L.current && W.current) {
|
|
2133
|
+
let g = L.current.getOriginalEditor(), w = me(W.current, e || "", o || s || "text", l || "");
|
|
2134
|
+
w !== g.getModel() && g.setModel(w);
|
|
2135
|
+
}
|
|
2136
|
+
}, [l], y), Z(() => {
|
|
2137
|
+
if (L.current && W.current) {
|
|
2138
|
+
let g = L.current.getModifiedEditor(), w = me(W.current, r || "", a || s || "text", c || "");
|
|
2139
|
+
w !== g.getModel() && g.setModel(w);
|
|
2140
|
+
}
|
|
2141
|
+
}, [c], y), Z(() => {
|
|
2142
|
+
let g = L.current.getModifiedEditor();
|
|
2143
|
+
g.getOption(W.current.editor.EditorOption.readOnly) ? g.setValue(r || "") : r !== g.getValue() && (g.executeEdits("", [{ range: g.getModel().getFullModelRange(), text: r || "", forceMoveMarkers: !0 }]), g.pushUndoStop());
|
|
2144
|
+
}, [r], y), Z(() => {
|
|
2145
|
+
var g, w;
|
|
2146
|
+
(w = (g = L.current) == null ? void 0 : g.getModel()) == null || w.original.setValue(e || "");
|
|
2147
|
+
}, [e], y), Z(() => {
|
|
2148
|
+
let { original: g, modified: w } = L.current.getModel();
|
|
2149
|
+
W.current.editor.setModelLanguage(g, o || s || "text"), W.current.editor.setModelLanguage(w, a || s || "text");
|
|
2150
|
+
}, [s, o, a], y), Z(() => {
|
|
2151
|
+
var g;
|
|
2152
|
+
(g = W.current) == null || g.editor.setTheme(h);
|
|
2153
|
+
}, [h], y), Z(() => {
|
|
2154
|
+
var g;
|
|
2155
|
+
(g = L.current) == null || g.updateOptions(i);
|
|
2156
|
+
}, [i], y);
|
|
2157
|
+
let ne = Te(() => {
|
|
2158
|
+
var q;
|
|
2159
|
+
if (!W.current) return;
|
|
2160
|
+
k.current(W.current);
|
|
2161
|
+
let g = me(W.current, e || "", o || s || "text", l || ""), w = me(W.current, r || "", a || s || "text", c || "");
|
|
2162
|
+
(q = L.current) == null || q.setModel({ original: g, modified: w });
|
|
2163
|
+
}, [s, r, a, e, o, l, c]), G = Te(() => {
|
|
2164
|
+
var g;
|
|
2165
|
+
!te.current && B.current && (L.current = W.current.editor.createDiffEditor(B.current, { automaticLayout: !0, ...i }), ne(), (g = W.current) == null || g.editor.setTheme(h), S(!0), te.current = !0);
|
|
2166
|
+
}, [i, h, ne]);
|
|
2167
|
+
oe(() => {
|
|
2168
|
+
y && U.current(L.current, W.current);
|
|
2169
|
+
}, [y]), oe(() => {
|
|
2170
|
+
!p && !y && G();
|
|
2171
|
+
}, [p, y, G]);
|
|
2172
|
+
function x() {
|
|
2173
|
+
var w, q, F, J;
|
|
2174
|
+
let g = (w = L.current) == null ? void 0 : w.getModel();
|
|
2175
|
+
f || ((q = g == null ? void 0 : g.original) == null || q.dispose()), u || ((F = g == null ? void 0 : g.modified) == null || F.dispose()), (J = L.current) == null || J.dispose();
|
|
2176
|
+
}
|
|
2177
|
+
return m.createElement(Mt, { width: T, height: A, isEditorReady: y, loading: v, _ref: B, className: V, wrapperProps: j });
|
|
2178
|
+
}
|
|
2179
|
+
var Jn = Yn;
|
|
2180
|
+
Be(Jn);
|
|
2181
|
+
function Bn(e) {
|
|
2182
|
+
let r = K();
|
|
2183
|
+
return oe(() => {
|
|
2184
|
+
r.current = e;
|
|
2185
|
+
}, [e]), r.current;
|
|
2186
|
+
}
|
|
2187
|
+
var Hn = Bn, Re = /* @__PURE__ */ new Map();
|
|
2188
|
+
function Kn({ defaultValue: e, defaultLanguage: r, defaultPath: s, value: o, language: a, path: l, theme: c = "light", line: f, loading: u = "Loading...", options: h = {}, overrideServices: v = {}, saveViewState: i = !0, keepCurrentModel: A = !1, width: T = "100%", height: V = "100%", className: j, wrapperProps: E = {}, beforeMount: O = ve, onMount: y = ve, onChange: S, onValidate: p = ve }) {
|
|
2189
|
+
let [N, L] = ke(!1), [W, B] = ke(!0), U = K(null), k = K(null), te = K(null), ne = K(y), G = K(O), x = K(), g = K(o), w = Hn(l), q = K(!1), F = K(!1);
|
|
2190
|
+
Ft(() => {
|
|
2191
|
+
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 ? I() : R.cancel();
|
|
2193
|
+
}), Z(() => {
|
|
2194
|
+
var D, H, se, ie;
|
|
2195
|
+
let R = me(U.current, e || o || "", r || a || "", l || s || "");
|
|
2196
|
+
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
|
+
}, [l], N), Z(() => {
|
|
2198
|
+
var R;
|
|
2199
|
+
(R = k.current) == null || R.updateOptions(h);
|
|
2200
|
+
}, [h], N), Z(() => {
|
|
2201
|
+
!k.current || o === void 0 || (k.current.getOption(U.current.editor.EditorOption.readOnly) ? k.current.setValue(o) : o !== k.current.getValue() && (F.current = !0, k.current.executeEdits("", [{ range: k.current.getModel().getFullModelRange(), text: o, forceMoveMarkers: !0 }]), k.current.pushUndoStop(), F.current = !1));
|
|
2202
|
+
}, [o], N), Z(() => {
|
|
2203
|
+
var D, H;
|
|
2204
|
+
let R = (D = k.current) == null ? void 0 : D.getModel();
|
|
2205
|
+
R && a && ((H = U.current) == null || H.editor.setModelLanguage(R, a));
|
|
2206
|
+
}, [a], N), Z(() => {
|
|
2207
|
+
var R;
|
|
2208
|
+
f !== void 0 && ((R = k.current) == null || R.revealLine(f));
|
|
2209
|
+
}, [f], N), Z(() => {
|
|
2210
|
+
var R;
|
|
2211
|
+
(R = U.current) == null || R.editor.setTheme(c);
|
|
2212
|
+
}, [c], N);
|
|
2213
|
+
let J = Te(() => {
|
|
2214
|
+
var R;
|
|
2215
|
+
if (!(!te.current || !U.current) && !q.current) {
|
|
2216
|
+
G.current(U.current);
|
|
2217
|
+
let D = l || s, H = me(U.current, o || e || "", r || a || "", D || "");
|
|
2218
|
+
k.current = (R = U.current) == null ? void 0 : R.editor.create(te.current, { model: H, automaticLayout: !0, ...h }, v), i && k.current.restoreViewState(Re.get(D)), U.current.editor.setTheme(c), f !== void 0 && k.current.revealLine(f), L(!0), q.current = !0;
|
|
2219
|
+
}
|
|
2220
|
+
}, [e, r, s, o, a, l, h, v, i, c, f]);
|
|
2221
|
+
oe(() => {
|
|
2222
|
+
N && ne.current(k.current, U.current);
|
|
2223
|
+
}, [N]), oe(() => {
|
|
2224
|
+
!W && !N && J();
|
|
2225
|
+
}, [W, N, J]), g.current = o, oe(() => {
|
|
2226
|
+
var R, D;
|
|
2227
|
+
N && S && ((R = x.current) == null || R.dispose(), x.current = (D = k.current) == null ? void 0 : D.onDidChangeModelContent((H) => {
|
|
2228
|
+
F.current || S(k.current.getValue(), H);
|
|
2229
|
+
}));
|
|
2230
|
+
}, [N, S]), oe(() => {
|
|
2231
|
+
if (N) {
|
|
2232
|
+
let R = U.current.editor.onDidChangeMarkers((D) => {
|
|
2233
|
+
var se;
|
|
2234
|
+
let H = (se = k.current.getModel()) == null ? void 0 : se.uri;
|
|
2235
|
+
if (H && D.find((ie) => ie.path === H.path)) {
|
|
2236
|
+
let ie = U.current.editor.getModelMarkers({ resource: H });
|
|
2237
|
+
p == null || p(ie);
|
|
2238
|
+
}
|
|
2239
|
+
});
|
|
2240
|
+
return () => {
|
|
2241
|
+
R == null || R.dispose();
|
|
2242
|
+
};
|
|
2243
|
+
}
|
|
2244
|
+
return () => {
|
|
2245
|
+
};
|
|
2246
|
+
}, [N, p]);
|
|
2247
|
+
function I() {
|
|
2248
|
+
var R, D;
|
|
2249
|
+
(R = x.current) == null || R.dispose(), A ? i && Re.set(l, k.current.saveViewState()) : (D = k.current.getModel()) == null || D.dispose(), k.current.dispose();
|
|
2250
|
+
}
|
|
2251
|
+
return m.createElement(Mt, { width: T, height: V, isEditorReady: N, loading: u, _ref: te, className: j, wrapperProps: E });
|
|
2252
|
+
}
|
|
2253
|
+
var Gn = Kn, Xn = Be(Gn), Qn = Xn;
|
|
2254
|
+
function Zn() {
|
|
2255
|
+
const e = Ct(), r = re((j) => j.replaceAll), s = ae(), o = m.useRef(null), [a, l] = m.useState("yaml"), [c, f] = m.useState(640), [u, h] = m.useState(() => {
|
|
2256
|
+
try {
|
|
2257
|
+
return pe.dump(e, { indent: 2, lineWidth: -1 });
|
|
2258
|
+
} catch {
|
|
2259
|
+
return "";
|
|
2260
|
+
}
|
|
2261
|
+
}), [v, i] = m.useState("");
|
|
2262
|
+
m.useEffect(() => {
|
|
2263
|
+
const j = () => {
|
|
2264
|
+
if (o.current) {
|
|
2265
|
+
const E = o.current.getBoundingClientRect().top, O = window.innerHeight - E - 20;
|
|
2266
|
+
f(Math.max(400, O));
|
|
2267
|
+
}
|
|
2268
|
+
};
|
|
2269
|
+
return j(), window.addEventListener("resize", j), () => window.removeEventListener("resize", j);
|
|
2270
|
+
}, []), m.useEffect(() => {
|
|
2271
|
+
try {
|
|
2272
|
+
const j = a === "json" ? JSON.stringify(e, null, 2) : pe.dump(e, { indent: 2, lineWidth: -1 });
|
|
2273
|
+
h(j), i("");
|
|
2274
|
+
} catch (j) {
|
|
2275
|
+
i(`Failed to serialize: ${j.message}`);
|
|
2276
|
+
}
|
|
2277
|
+
}, [e, a]);
|
|
2278
|
+
const A = (j) => {
|
|
2279
|
+
h(j || ""), i("");
|
|
2280
|
+
}, T = () => {
|
|
2281
|
+
try {
|
|
2282
|
+
let j;
|
|
2283
|
+
if (a === "json" ? j = JSON.parse(u) : j = pe.load(u), !j || typeof j != "object")
|
|
2284
|
+
throw new Error("Invalid form data: must be an object");
|
|
2285
|
+
Array.isArray(j.fields) || (j.fields = j.fields || []), r(j), i(""), s.preview.set(!1), s.codeEditor.set(!1);
|
|
2286
|
+
} catch (j) {
|
|
2287
|
+
i(`Invalid ${a.toUpperCase()}: ${j.message}`);
|
|
2288
|
+
}
|
|
2289
|
+
}, V = (j) => {
|
|
2290
|
+
try {
|
|
2291
|
+
let E;
|
|
2292
|
+
const O = a === "json" ? JSON.parse(u) : pe.load(u);
|
|
2293
|
+
j === "json" ? E = JSON.stringify(O, null, 2) : E = pe.dump(O, { indent: 2, lineWidth: -1 }), h(E), l(j), i("");
|
|
2294
|
+
} catch (E) {
|
|
2295
|
+
i(`Cannot convert: ${E.message}`);
|
|
2296
|
+
}
|
|
2297
|
+
};
|
|
2298
|
+
return /* @__PURE__ */ t.jsxs("div", { ref: o, className: "code-editor-container flex flex-col bg-gray-50 max-w-7xl w-full", style: { height: `${c}px` }, children: [
|
|
2299
|
+
/* @__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
|
+
/* @__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
|
+
/* @__PURE__ */ t.jsx(
|
|
2302
|
+
"button",
|
|
1649
2303
|
{
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
children:
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
2304
|
+
onClick: () => V("yaml"),
|
|
2305
|
+
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${a === "yaml" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
2306
|
+
children: "YAML"
|
|
2307
|
+
}
|
|
2308
|
+
),
|
|
2309
|
+
/* @__PURE__ */ t.jsx(
|
|
2310
|
+
"button",
|
|
2311
|
+
{
|
|
2312
|
+
onClick: () => V("json"),
|
|
2313
|
+
className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${a === "json" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
|
|
2314
|
+
children: "JSON"
|
|
2315
|
+
}
|
|
2316
|
+
)
|
|
2317
|
+
] }) }),
|
|
2318
|
+
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2319
|
+
v && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-red-600 bg-red-50 px-3 py-1 rounded-lg", children: v }),
|
|
2320
|
+
/* @__PURE__ */ t.jsx(
|
|
2321
|
+
"button",
|
|
2322
|
+
{
|
|
2323
|
+
onClick: T,
|
|
2324
|
+
className: "px-4 py-2 rounded-lg border border-black/15 bg-white hover:bg-black/5 text-sm font-medium transition-colors",
|
|
2325
|
+
children: "Apply Changes"
|
|
1663
2326
|
}
|
|
1664
2327
|
)
|
|
2328
|
+
] })
|
|
2329
|
+
] }),
|
|
2330
|
+
/* @__PURE__ */ t.jsx("div", { className: "code-editor-content flex-1 overflow-hidden", children: /* @__PURE__ */ t.jsx(
|
|
2331
|
+
Qn,
|
|
2332
|
+
{
|
|
2333
|
+
height: "100%",
|
|
2334
|
+
language: a,
|
|
2335
|
+
value: u,
|
|
2336
|
+
onChange: A,
|
|
2337
|
+
theme: "light",
|
|
2338
|
+
options: {
|
|
2339
|
+
minimap: { enabled: !1 },
|
|
2340
|
+
fontSize: 13,
|
|
2341
|
+
lineHeight: 1.5,
|
|
2342
|
+
wordWrap: "on",
|
|
2343
|
+
formatOnPaste: !0,
|
|
2344
|
+
formatOnType: !0,
|
|
2345
|
+
tabSize: 2,
|
|
2346
|
+
automaticLayout: !0,
|
|
2347
|
+
scrollBeyondLastLine: !1,
|
|
2348
|
+
padding: { top: 16 }
|
|
2349
|
+
}
|
|
1665
2350
|
}
|
|
1666
2351
|
) })
|
|
1667
|
-
] })
|
|
1668
|
-
}
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
2352
|
+
] });
|
|
2353
|
+
}
|
|
2354
|
+
function es({ selectedField: e }) {
|
|
2355
|
+
const r = ae(), [s, o] = m.useState(!1), a = r.state.isPreview, l = r.state.isCodeEditor, c = r.state.isEditModalOpen, f = r.state.panelResetKey, u = !a;
|
|
2356
|
+
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(Zn, {}) }) : /* @__PURE__ */ t.jsxs("div", { className: "layout-grid flex lg:gap-3 h-full", children: [
|
|
2358
|
+
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(Wr, {}) }),
|
|
2360
|
+
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
|
+
u && /* @__PURE__ */ t.jsx("div", { className: "layout-mobile-modal lg:hidden", children: c && e && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
2362
|
+
/* @__PURE__ */ t.jsx(
|
|
2363
|
+
"div",
|
|
2364
|
+
{
|
|
2365
|
+
className: "fixed inset-0 z-40 bg-black/30 lg:hidden",
|
|
2366
|
+
onClick: () => r.modal.set(!1)
|
|
2367
|
+
}
|
|
2368
|
+
),
|
|
2369
|
+
/* @__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("div", { className: "[&_.edit-panel-container]:overflow-visible [&_.edit-panel-container]:max-h-none", children: /* @__PURE__ */ t.jsx(gt, {}, f) }) })
|
|
2370
|
+
] }) })
|
|
2371
|
+
] }),
|
|
2372
|
+
u && !l && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
2373
|
+
/* @__PURE__ */ t.jsx(
|
|
2374
|
+
"button",
|
|
2375
|
+
{
|
|
2376
|
+
onClick: () => o(!s),
|
|
2377
|
+
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
|
+
title: "Add field",
|
|
2379
|
+
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" }) })
|
|
2380
|
+
}
|
|
2381
|
+
),
|
|
2382
|
+
s && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
2383
|
+
/* @__PURE__ */ t.jsx(
|
|
2384
|
+
"div",
|
|
2385
|
+
{
|
|
2386
|
+
className: "fixed inset-0 z-40 bg-black/30 lg:hidden",
|
|
2387
|
+
onClick: () => o(!1)
|
|
2388
|
+
}
|
|
2389
|
+
),
|
|
2390
|
+
/* @__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, {}) })
|
|
2391
|
+
] })
|
|
2392
|
+
] })
|
|
2393
|
+
] });
|
|
2394
|
+
}
|
|
2395
|
+
const ts = (e) => e;
|
|
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])
|
|
1675
2401
|
);
|
|
1676
|
-
return
|
|
1677
|
-
}
|
|
1678
|
-
function
|
|
1679
|
-
initialFormData:
|
|
1680
|
-
schemaType:
|
|
1681
|
-
onChange:
|
|
1682
|
-
className:
|
|
1683
|
-
showHeader:
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
hideUnsupportedFields: x = !1
|
|
2402
|
+
return m.useDebugValue(s), s;
|
|
2403
|
+
}
|
|
2404
|
+
function ns({
|
|
2405
|
+
initialFormData: e,
|
|
2406
|
+
schemaType: r,
|
|
2407
|
+
onChange: s,
|
|
2408
|
+
className: o = "",
|
|
2409
|
+
showHeader: a = !0,
|
|
2410
|
+
startInPreview: l = !1,
|
|
2411
|
+
hideUnsupportedFields: c = !1
|
|
1687
2412
|
}) {
|
|
1688
|
-
const
|
|
1689
|
-
|
|
1690
|
-
var
|
|
1691
|
-
if (!(
|
|
1692
|
-
if (
|
|
2413
|
+
const [f, u] = m.useState("json"), h = ae(), v = m.useRef(!1), i = m.useContext(He);
|
|
2414
|
+
m.useEffect(() => {
|
|
2415
|
+
var T;
|
|
2416
|
+
if (!(v.current || !i)) {
|
|
2417
|
+
if (e)
|
|
1693
2418
|
try {
|
|
1694
|
-
const { data:
|
|
1695
|
-
|
|
1696
|
-
const
|
|
1697
|
-
schemaType:
|
|
1698
|
-
fields:
|
|
2419
|
+
const { data: V, schemaType: j } = Et(e, r), E = Nt(V, j);
|
|
2420
|
+
E.conversionReport && h.setConversionReport(E.conversionReport);
|
|
2421
|
+
const O = {
|
|
2422
|
+
schemaType: j === "surveyjs" ? "mieforms-v1.0" : V.schemaType || "mieforms-v1.0",
|
|
2423
|
+
fields: E.fields || []
|
|
1699
2424
|
};
|
|
1700
|
-
if (
|
|
1701
|
-
Object.assign(
|
|
1702
|
-
else if (
|
|
1703
|
-
const { fields:
|
|
1704
|
-
Object.keys(
|
|
2425
|
+
if (j === "surveyjs" && ((T = E.conversionReport) != null && T.surveyMetadata))
|
|
2426
|
+
Object.assign(O, E.conversionReport.surveyMetadata);
|
|
2427
|
+
else if (j === "mieforms") {
|
|
2428
|
+
const { fields: y, schemaType: S, ...p } = V;
|
|
2429
|
+
Object.keys(p).length > 0 && Object.assign(O, p);
|
|
1705
2430
|
}
|
|
1706
|
-
Array.isArray(
|
|
2431
|
+
Array.isArray(O.fields) && O.fields.length && i.getState().replaceAll(O);
|
|
1707
2432
|
} catch {
|
|
1708
|
-
|
|
2433
|
+
i.getState().replaceAll({ schemaType: "mieforms-v1.0", fields: [] });
|
|
1709
2434
|
}
|
|
1710
|
-
|
|
1711
|
-
}
|
|
1712
|
-
}, [r,
|
|
1713
|
-
|
|
1714
|
-
}, [
|
|
1715
|
-
if (!(!
|
|
1716
|
-
return
|
|
1717
|
-
|
|
1718
|
-
schemaType:
|
|
1719
|
-
...
|
|
1720
|
-
fields:
|
|
2435
|
+
h.preview.set(!!l), v.current = !0;
|
|
2436
|
+
}
|
|
2437
|
+
}, [e, r, l, h, i]), m.useEffect(() => {
|
|
2438
|
+
h.setHideUnsupportedFields(c);
|
|
2439
|
+
}, [c, h]), m.useEffect(() => {
|
|
2440
|
+
if (!(!s || !i))
|
|
2441
|
+
return i.subscribe((T) => {
|
|
2442
|
+
s({
|
|
2443
|
+
schemaType: T.schemaType || "mieforms-v1.0",
|
|
2444
|
+
...T.schemaMetadata,
|
|
2445
|
+
fields: T.order.map((V) => T.byId[V])
|
|
1721
2446
|
});
|
|
1722
2447
|
});
|
|
1723
|
-
}, [
|
|
1724
|
-
const
|
|
1725
|
-
|
|
1726
|
-
(
|
|
2448
|
+
}, [s, i]);
|
|
2449
|
+
const A = rs(
|
|
2450
|
+
i,
|
|
2451
|
+
(T) => h.selectedFieldId.value ? T.byId[h.selectedFieldId.value] : null
|
|
1727
2452
|
);
|
|
1728
|
-
return /* @__PURE__ */ t.jsxs("div", { className: `qb-editor-root
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
/* @__PURE__ */ t.jsx(sr, { selectedField: y })
|
|
2453
|
+
return /* @__PURE__ */ t.jsxs("div", { className: `qb-editor-root editor-container w-full max-w-7xl mx-auto bg-gray-100 font-titillium ${o}`, children: [
|
|
2454
|
+
a && /* @__PURE__ */ t.jsx(Ar, { codeFormat: f, onCodeFormatChange: u }),
|
|
2455
|
+
/* @__PURE__ */ t.jsx(es, { selectedField: A, codeFormat: f })
|
|
1732
2456
|
] });
|
|
1733
2457
|
}
|
|
1734
|
-
function
|
|
1735
|
-
const
|
|
1736
|
-
return /* @__PURE__ */ t.jsx(
|
|
2458
|
+
function is(e) {
|
|
2459
|
+
const r = m.useRef(Ir()).current, s = m.useRef(Rr()).current;
|
|
2460
|
+
return /* @__PURE__ */ t.jsx(He.Provider, { value: r, children: /* @__PURE__ */ t.jsx(Tr.Provider, { value: s, children: /* @__PURE__ */ t.jsx(ns, { ...e }) }) });
|
|
1737
2461
|
}
|
|
1738
2462
|
export {
|
|
1739
|
-
|
|
2463
|
+
is as QuestionnaireEditor
|
|
1740
2464
|
};
|
|
1741
2465
|
//# sourceMappingURL=index.js.map
|