@mieweb/forms-editor 1.1.0 → 1.3.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/dist/index.js CHANGED
@@ -5,820 +5,443 @@
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.0.6 | MIT License | https://tailwindcss.com */\n@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');\n.pointer-events-none {\n pointer-events: none;\n}\n.\\!visible {\n visibility: visible !important;\n}\n.collapse {\n visibility: collapse;\n}\n.visible {\n visibility: visible;\n}\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n.absolute {\n position: absolute;\n}\n.fixed {\n position: fixed;\n}\n.relative {\n position: relative;\n}\n.static {\n position: static;\n}\n.sticky {\n position: sticky;\n}\n.inset-0 {\n inset: calc(var(--spacing) * 0);\n}\n.-top-\\[20\\%\\] {\n top: calc(20% * -1);\n}\n.top-0 {\n top: calc(var(--spacing) * 0);\n}\n.top-1\\/2 {\n top: calc(1/2 * 100%);\n}\n.top-2 {\n top: calc(var(--spacing) * 2);\n}\n.top-3 {\n top: calc(var(--spacing) * 3);\n}\n.top-4 {\n top: calc(var(--spacing) * 4);\n}\n.top-6 {\n top: calc(var(--spacing) * 6);\n}\n.top-11 {\n top: calc(var(--spacing) * 11);\n}\n.top-\\[10\\%\\] {\n top: 10%;\n}\n.top-full {\n top: 100%;\n}\n.-right-\\[10\\%\\] {\n right: calc(10% * -1);\n}\n.right-0 {\n right: calc(var(--spacing) * 0);\n}\n.right-2 {\n right: calc(var(--spacing) * 2);\n}\n.right-3 {\n right: calc(var(--spacing) * 3);\n}\n.right-4 {\n right: calc(var(--spacing) * 4);\n}\n.bottom-0 {\n bottom: calc(var(--spacing) * 0);\n}\n.bottom-5 {\n bottom: calc(var(--spacing) * 5);\n}\n.bottom-full {\n bottom: 100%;\n}\n.-left-2 {\n left: calc(var(--spacing) * -2);\n}\n.-left-\\[10\\%\\] {\n left: calc(10% * -1);\n}\n.left-0 {\n left: calc(var(--spacing) * 0);\n}\n.left-5 {\n left: calc(var(--spacing) * 5);\n}\n.z-10 {\n z-index: 10;\n}\n.z-20 {\n z-index: 20;\n}\n.z-40 {\n z-index: 40;\n}\n.z-50 {\n z-index: 50;\n}\n.z-60 {\n z-index: 60;\n}\n.z-9999 {\n z-index: 9999;\n}\n.z-\\[9999\\] {\n z-index: 9999;\n}\n.\\!container {\n width: 100% !important;\n @media (width >= 40rem) {\n max-width: 40rem !important;\n }\n @media (width >= 48rem) {\n max-width: 48rem !important;\n }\n @media (width >= 64rem) {\n max-width: 64rem !important;\n }\n @media (width >= 80rem) {\n max-width: 80rem !important;\n }\n @media (width >= 96rem) {\n max-width: 96rem !important;\n }\n}\n.container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n}\n.m-0 {\n margin: calc(var(--spacing) * 0);\n}\n.-mx-6 {\n margin-inline: calc(var(--spacing) * -6);\n}\n.mx-4 {\n margin-inline: calc(var(--spacing) * 4);\n}\n.mx-auto {\n margin-inline: auto;\n}\n.my-2 {\n margin-block: calc(var(--spacing) * 2);\n}\n.my-9 {\n margin-block: calc(var(--spacing) * 9);\n}\n.-mt-6 {\n margin-top: calc(var(--spacing) * -6);\n}\n.mt-0 {\n margin-top: calc(var(--spacing) * 0);\n}\n.mt-1 {\n margin-top: calc(var(--spacing) * 1);\n}\n.mt-2 {\n margin-top: calc(var(--spacing) * 2);\n}\n.mt-3 {\n margin-top: calc(var(--spacing) * 3);\n}\n.mt-4 {\n margin-top: calc(var(--spacing) * 4);\n}\n.mt-5 {\n margin-top: calc(var(--spacing) * 5);\n}\n.mt-8 {\n margin-top: calc(var(--spacing) * 8);\n}\n.mt-12 {\n margin-top: calc(var(--spacing) * 12);\n}\n.mr-2 {\n margin-right: calc(var(--spacing) * 2);\n}\n.mb-0 {\n margin-bottom: calc(var(--spacing) * 0);\n}\n.mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n}\n.mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n}\n.mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n}\n.mb-2\\.5 {\n margin-bottom: calc(var(--spacing) * 2.5);\n}\n.mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n}\n.mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n}\n.mb-5 {\n margin-bottom: calc(var(--spacing) * 5);\n}\n.mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n}\n.mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n}\n.mb-10 {\n margin-bottom: calc(var(--spacing) * 10);\n}\n.mb-12 {\n margin-bottom: calc(var(--spacing) * 12);\n}\n.mb-14 {\n margin-bottom: calc(var(--spacing) * 14);\n}\n.mb-16 {\n margin-bottom: calc(var(--spacing) * 16);\n}\n.mb-20 {\n margin-bottom: calc(var(--spacing) * 20);\n}\n.ml-2 {\n margin-left: calc(var(--spacing) * 2);\n}\n.ml-auto {\n margin-left: auto;\n}\n.block {\n display: block;\n}\n.contents {\n display: contents;\n}\n.flex {\n display: flex;\n}\n.grid {\n display: grid;\n}\n.hidden {\n display: none;\n}\n.inline {\n display: inline;\n}\n.inline-block {\n display: inline-block;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.h-1 {\n height: calc(var(--spacing) * 1);\n}\n.h-3 {\n height: calc(var(--spacing) * 3);\n}\n.h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n}\n.h-4 {\n height: calc(var(--spacing) * 4);\n}\n.h-5 {\n height: calc(var(--spacing) * 5);\n}\n.h-6 {\n height: calc(var(--spacing) * 6);\n}\n.h-7 {\n height: calc(var(--spacing) * 7);\n}\n.h-8 {\n height: calc(var(--spacing) * 8);\n}\n.h-9 {\n height: calc(var(--spacing) * 9);\n}\n.h-10 {\n height: calc(var(--spacing) * 10);\n}\n.h-11 {\n height: calc(var(--spacing) * 11);\n}\n.h-12 {\n height: calc(var(--spacing) * 12);\n}\n.h-16 {\n height: calc(var(--spacing) * 16);\n}\n.h-24 {\n height: calc(var(--spacing) * 24);\n}\n.h-72 {\n height: calc(var(--spacing) * 72);\n}\n.h-\\[60\\%\\] {\n height: 60%;\n}\n.h-\\[80\\%\\] {\n height: 80%;\n}\n.h-auto {\n height: auto;\n}\n.h-fit {\n height: fit-content;\n}\n.h-full {\n height: 100%;\n}\n.h-screen {\n height: 100vh;\n}\n.max-h-48 {\n max-height: calc(var(--spacing) * 48);\n}\n.max-h-56 {\n max-height: calc(var(--spacing) * 56);\n}\n.max-h-60 {\n max-height: calc(var(--spacing) * 60);\n}\n.max-h-64 {\n max-height: calc(var(--spacing) * 64);\n}\n.max-h-75 {\n max-height: calc(var(--spacing) * 75);\n}\n.max-h-96 {\n max-height: calc(var(--spacing) * 96);\n}\n.max-h-\\[60vh\\] {\n max-height: 60vh;\n}\n.max-h-\\[calc\\(100svh-13rem\\)\\] {\n max-height: calc(100svh - 13rem);\n}\n.max-h-\\[calc\\(100svh-24rem\\)\\] {\n max-height: calc(100svh - 24rem);\n}\n.max-h-screen {\n max-height: 100vh;\n}\n.min-h-10 {\n min-height: calc(var(--spacing) * 10);\n}\n.min-h-24 {\n min-height: calc(var(--spacing) * 24);\n}\n.min-h-64 {\n min-height: calc(var(--spacing) * 64);\n}\n.min-h-\\[calc\\(100vh-10rem\\)\\] {\n min-height: calc(100vh - 10rem);\n}\n.min-h-\\[calc\\(100vh-85px\\)\\] {\n min-height: calc(100vh - 85px);\n}\n.min-h-dvh {\n min-height: 100dvh;\n}\n.min-h-screen {\n min-height: 100vh;\n}\n.w-1\\/2 {\n width: calc(1/2 * 100%);\n}\n.w-3 {\n width: calc(var(--spacing) * 3);\n}\n.w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n}\n.w-3\\/4 {\n width: calc(3/4 * 100%);\n}\n.w-4 {\n width: calc(var(--spacing) * 4);\n}\n.w-5 {\n width: calc(var(--spacing) * 5);\n}\n.w-6 {\n width: calc(var(--spacing) * 6);\n}\n.w-7 {\n width: calc(var(--spacing) * 7);\n}\n.w-8 {\n width: calc(var(--spacing) * 8);\n}\n.w-9 {\n width: calc(var(--spacing) * 9);\n}\n.w-12 {\n width: calc(var(--spacing) * 12);\n}\n.w-16 {\n width: calc(var(--spacing) * 16);\n}\n.w-20 {\n width: calc(var(--spacing) * 20);\n}\n.w-32 {\n width: calc(var(--spacing) * 32);\n}\n.w-48 {\n width: calc(var(--spacing) * 48);\n}\n.w-\\[40\\%\\] {\n width: 40%;\n}\n.w-\\[50\\%\\] {\n width: 50%;\n}\n.w-fit {\n width: fit-content;\n}\n.w-full {\n width: 100%;\n}\n.w-px {\n width: 1px;\n}\n.max-w-2xl {\n max-width: var(--container-2xl);\n}\n.max-w-3xl {\n max-width: var(--container-3xl);\n}\n.max-w-4xl {\n max-width: var(--container-4xl);\n}\n.max-w-5xl {\n max-width: var(--container-5xl);\n}\n.max-w-7xl {\n max-width: var(--container-7xl);\n}\n.max-w-\\[80vw\\] {\n max-width: 80vw;\n}\n.max-w-full {\n max-width: 100%;\n}\n.max-w-md {\n max-width: var(--container-md);\n}\n.max-w-xl {\n max-width: var(--container-xl);\n}\n.min-w-0 {\n min-width: calc(var(--spacing) * 0);\n}\n.min-w-\\[44px\\] {\n min-width: 44px;\n}\n.min-w-fit {\n min-width: fit-content;\n}\n.flex-1 {\n flex: 1;\n}\n.flex-shrink-0 {\n flex-shrink: 0;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n}\n.scale-105 {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n}\n.rotate-180 {\n rotate: 180deg;\n}\n.transform {\n transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.touch-manipulation {\n touch-action: manipulation;\n}\n.resize {\n resize: both;\n}\n.resize-y {\n resize: vertical;\n}\n.appearance-none {\n appearance: none;\n}\n.grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-center {\n align-items: center;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-start {\n align-items: flex-start;\n}\n.justify-between {\n justify-content: space-between;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-evenly {\n justify-content: space-evenly;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.gap-0 {\n gap: calc(var(--spacing) * 0);\n}\n.gap-1 {\n gap: calc(var(--spacing) * 1);\n}\n.gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n}\n.gap-2 {\n gap: calc(var(--spacing) * 2);\n}\n.gap-3 {\n gap: calc(var(--spacing) * 3);\n}\n.gap-4 {\n gap: calc(var(--spacing) * 4);\n}\n.gap-5 {\n gap: calc(var(--spacing) * 5);\n}\n.gap-6 {\n gap: calc(var(--spacing) * 6);\n}\n.gap-8 {\n gap: calc(var(--spacing) * 8);\n}\n.space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.overflow-y-visible {\n overflow-y: visible;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-2xl {\n border-radius: var(--radius-2xl);\n}\n.rounded-3xl {\n border-radius: var(--radius-3xl);\n}\n.rounded-full {\n border-radius: calc(infinity * 1px);\n}\n.rounded-lg {\n border-radius: var(--radius-lg);\n}\n.rounded-md {\n border-radius: var(--radius-md);\n}\n.rounded-xl {\n border-radius: var(--radius-xl);\n}\n.rounded-t-2xl {\n border-top-left-radius: var(--radius-2xl);\n border-top-right-radius: var(--radius-2xl);\n}\n.rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n}\n.border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n}\n.border-0 {\n border-style: var(--tw-border-style);\n border-width: 0px;\n}\n.border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n}\n.border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n}\n.border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n}\n.border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n}\n.border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n}\n.border-black\\/15 {\n border-color: color-mix(in oklab, var(--color-black) 15%, transparent);\n}\n.border-black\\/20 {\n border-color: color-mix(in oklab, var(--color-black) 20%, transparent);\n}\n.border-blue-200 {\n border-color: var(--color-blue-200);\n}\n.border-blue-200\\/60 {\n border-color: color-mix(in oklab, var(--color-blue-200) 60%, transparent);\n}\n.border-blue-300 {\n border-color: var(--color-blue-300);\n}\n.border-blue-400 {\n border-color: var(--color-blue-400);\n}\n.border-blue-600 {\n border-color: var(--color-blue-600);\n}\n.border-gray-100 {\n border-color: var(--color-gray-100);\n}\n.border-gray-200 {\n border-color: var(--color-gray-200);\n}\n.border-gray-300 {\n border-color: var(--color-gray-300);\n}\n.border-green-200 {\n border-color: var(--color-green-200);\n}\n.border-orange-500 {\n border-color: var(--color-orange-500);\n}\n.border-red-200 {\n border-color: var(--color-red-200);\n}\n.border-red-300 {\n border-color: var(--color-red-300);\n}\n.border-slate-100\\/80 {\n border-color: color-mix(in oklab, var(--color-slate-100) 80%, transparent);\n}\n.border-slate-200 {\n border-color: var(--color-slate-200);\n}\n.border-slate-300 {\n border-color: var(--color-slate-300);\n}\n.border-slate-700 {\n border-color: var(--color-slate-700);\n}\n.border-transparent {\n border-color: transparent;\n}\n.border-white\\/30 {\n border-color: color-mix(in oklab, var(--color-white) 30%, transparent);\n}\n.border-white\\/40 {\n border-color: color-mix(in oklab, var(--color-white) 40%, transparent);\n}\n.bg-black\\/5 {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n}\n.bg-black\\/30 {\n background-color: color-mix(in oklab, var(--color-black) 30%, transparent);\n}\n.bg-black\\/50 {\n background-color: color-mix(in oklab, var(--color-black) 50%, transparent);\n}\n.bg-blue-50 {\n background-color: var(--color-blue-50);\n}\n.bg-blue-100 {\n background-color: var(--color-blue-100);\n}\n.bg-blue-100\\/50 {\n background-color: color-mix(in oklab, var(--color-blue-100) 50%, transparent);\n}\n.bg-blue-100\\/70 {\n background-color: color-mix(in oklab, var(--color-blue-100) 70%, transparent);\n}\n.bg-blue-200\\/40 {\n background-color: color-mix(in oklab, var(--color-blue-200) 40%, transparent);\n}\n.bg-blue-400 {\n background-color: var(--color-blue-400);\n}\n.bg-blue-500 {\n background-color: var(--color-blue-500);\n}\n.bg-blue-600 {\n background-color: var(--color-blue-600);\n}\n.bg-gray-50 {\n background-color: var(--color-gray-50);\n}\n.bg-gray-100 {\n background-color: var(--color-gray-100);\n}\n.bg-gray-200 {\n background-color: var(--color-gray-200);\n}\n.bg-gray-300 {\n background-color: var(--color-gray-300);\n}\n.bg-gray-700 {\n background-color: var(--color-gray-700);\n}\n.bg-green-50 {\n background-color: var(--color-green-50);\n}\n.bg-green-100 {\n background-color: var(--color-green-100);\n}\n.bg-green-200\\/40 {\n background-color: color-mix(in oklab, var(--color-green-200) 40%, transparent);\n}\n.bg-indigo-100 {\n background-color: var(--color-indigo-100);\n}\n.bg-neutral-100 {\n background-color: var(--color-neutral-100);\n}\n.bg-orange-50 {\n background-color: var(--color-orange-50);\n}\n.bg-orange-500 {\n background-color: var(--color-orange-500);\n}\n.bg-red-50 {\n background-color: var(--color-red-50);\n}\n.bg-red-100 {\n background-color: var(--color-red-100);\n}\n.bg-slate-50 {\n background-color: var(--color-slate-50);\n}\n.bg-slate-50\\/60 {\n background-color: color-mix(in oklab, var(--color-slate-50) 60%, transparent);\n}\n.bg-slate-100 {\n background-color: var(--color-slate-100);\n}\n.bg-slate-800 {\n background-color: var(--color-slate-800);\n}\n.bg-slate-900 {\n background-color: var(--color-slate-900);\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n background-color: var(--color-white);\n}\n.bg-white\\/70 {\n background-color: color-mix(in oklab, var(--color-white) 70%, transparent);\n}\n.bg-white\\/75 {\n background-color: color-mix(in oklab, var(--color-white) 75%, transparent);\n}\n.bg-linear-\\[to_right\\,\\#059669\\,\\#0891b2_30\\%\\,\\#f59e0b_60\\%\\,\\#22c55e\\] {\n --tw-gradient-position: to right,#059669,#0891b2 30%,#f59e0b 60%,#22c55e;\n background-image: linear-gradient(var(--tw-gradient-stops,to right,#059669,#0891b2 30%,#f59e0b 60%,#22c55e));\n}\n.bg-linear-to-b {\n --tw-gradient-position: to bottom in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-linear-to-br {\n --tw-gradient-position: to bottom right in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.bg-linear-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-slate-50 {\n --tw-gradient-from: var(--color-slate-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.from-white {\n --tw-gradient-from: var(--color-white);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-50 {\n --tw-gradient-to: var(--color-gray-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-gray-100 {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-slate-50 {\n --tw-gradient-to: var(--color-slate-50);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.to-white {\n --tw-gradient-to: var(--color-white);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n}\n.bg-clip-text {\n background-clip: text;\n}\n.object-contain {\n object-fit: contain;\n}\n.p-0 {\n padding: calc(var(--spacing) * 0);\n}\n.p-1 {\n padding: calc(var(--spacing) * 1);\n}\n.p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n}\n.p-2 {\n padding: calc(var(--spacing) * 2);\n}\n.p-3 {\n padding: calc(var(--spacing) * 3);\n}\n.p-4 {\n padding: calc(var(--spacing) * 4);\n}\n.p-6 {\n padding: calc(var(--spacing) * 6);\n}\n.p-7 {\n padding: calc(var(--spacing) * 7);\n}\n.p-8 {\n padding: calc(var(--spacing) * 8);\n}\n.px-0 {\n padding-inline: calc(var(--spacing) * 0);\n}\n.px-0\\.5 {\n padding-inline: calc(var(--spacing) * 0.5);\n}\n.px-2 {\n padding-inline: calc(var(--spacing) * 2);\n}\n.px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n}\n.px-3 {\n padding-inline: calc(var(--spacing) * 3);\n}\n.px-4 {\n padding-inline: calc(var(--spacing) * 4);\n}\n.px-5 {\n padding-inline: calc(var(--spacing) * 5);\n}\n.px-6 {\n padding-inline: calc(var(--spacing) * 6);\n}\n.px-8 {\n padding-inline: calc(var(--spacing) * 8);\n}\n.py-0\\.5 {\n padding-block: calc(var(--spacing) * 0.5);\n}\n.py-1 {\n padding-block: calc(var(--spacing) * 1);\n}\n.py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n}\n.py-2 {\n padding-block: calc(var(--spacing) * 2);\n}\n.py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n}\n.py-3 {\n padding-block: calc(var(--spacing) * 3);\n}\n.py-4 {\n padding-block: calc(var(--spacing) * 4);\n}\n.py-5 {\n padding-block: calc(var(--spacing) * 5);\n}\n.py-10 {\n padding-block: calc(var(--spacing) * 10);\n}\n.py-16 {\n padding-block: calc(var(--spacing) * 16);\n}\n.py-20 {\n padding-block: calc(var(--spacing) * 20);\n}\n.pt-1 {\n padding-top: calc(var(--spacing) * 1);\n}\n.pt-2 {\n padding-top: calc(var(--spacing) * 2);\n}\n.pt-3 {\n padding-top: calc(var(--spacing) * 3);\n}\n.pt-4 {\n padding-top: calc(var(--spacing) * 4);\n}\n.pt-5 {\n padding-top: calc(var(--spacing) * 5);\n}\n.pt-6 {\n padding-top: calc(var(--spacing) * 6);\n}\n.pt-8 {\n padding-top: calc(var(--spacing) * 8);\n}\n.pt-20 {\n padding-top: calc(var(--spacing) * 20);\n}\n.pt-32 {\n padding-top: calc(var(--spacing) * 32);\n}\n.pr-10 {\n padding-right: calc(var(--spacing) * 10);\n}\n.pr-16 {\n padding-right: calc(var(--spacing) * 16);\n}\n.pr-28 {\n padding-right: calc(var(--spacing) * 28);\n}\n.pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n}\n.pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n}\n.pb-8 {\n padding-bottom: calc(var(--spacing) * 8);\n}\n.pb-20 {\n padding-bottom: calc(var(--spacing) * 20);\n}\n.pl-32 {\n padding-left: calc(var(--spacing) * 32);\n}\n.text-center {\n text-align: center;\n}\n.text-left {\n text-align: left;\n}\n.font-mono {\n font-family: var(--font-mono);\n}\n.font-sans {\n font-family: var(--font-sans);\n}\n.font-titillium {\n font-family: var(--font-titillium);\n}\n.text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n}\n.text-4xl {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n}\n.text-7xl {\n font-size: var(--text-7xl);\n line-height: var(--tw-leading, var(--text-7xl--line-height));\n}\n.text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n}\n.text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n}\n.text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n}\n.text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n}\n.text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n}\n.text-\\[14px\\] {\n font-size: 14px;\n}\n.leading-none {\n --tw-leading: 1;\n line-height: 1;\n}\n.leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n}\n.leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n}\n.font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n}\n.font-extrabold {\n --tw-font-weight: var(--font-weight-extrabold);\n font-weight: var(--font-weight-extrabold);\n}\n.font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n}\n.font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n}\n.font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n}\n.font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n}\n.tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n}\n.tracking-wide {\n --tw-tracking: var(--tracking-wide);\n letter-spacing: var(--tracking-wide);\n}\n.break-words {\n overflow-wrap: break-word;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.whitespace-pre-line {\n white-space: pre-line;\n}\n.text-blue-500 {\n color: var(--color-blue-500);\n}\n.text-blue-600 {\n color: var(--color-blue-600);\n}\n.text-blue-800 {\n color: var(--color-blue-800);\n}\n.text-blue-900 {\n color: var(--color-blue-900);\n}\n.text-gray-300 {\n color: var(--color-gray-300);\n}\n.text-gray-400 {\n color: var(--color-gray-400);\n}\n.text-gray-500 {\n color: var(--color-gray-500);\n}\n.text-gray-600 {\n color: var(--color-gray-600);\n}\n.text-gray-700 {\n color: var(--color-gray-700);\n}\n.text-gray-800 {\n color: var(--color-gray-800);\n}\n.text-gray-900 {\n color: var(--color-gray-900);\n}\n.text-green-600 {\n color: var(--color-green-600);\n}\n.text-green-700 {\n color: var(--color-green-700);\n}\n.text-indigo-700 {\n color: var(--color-indigo-700);\n}\n.text-orange-700 {\n color: var(--color-orange-700);\n}\n.text-red-600 {\n color: var(--color-red-600);\n}\n.text-red-700 {\n color: var(--color-red-700);\n}\n.text-slate-100 {\n color: var(--color-slate-100);\n}\n.text-slate-300 {\n color: var(--color-slate-300);\n}\n.text-slate-400 {\n color: var(--color-slate-400);\n}\n.text-slate-500 {\n color: var(--color-slate-500);\n}\n.text-slate-600 {\n color: var(--color-slate-600);\n}\n.text-slate-700 {\n color: var(--color-slate-700);\n}\n.text-slate-800 {\n color: var(--color-slate-800);\n}\n.text-slate-900 {\n color: var(--color-slate-900);\n}\n.text-transparent {\n color: transparent;\n}\n.text-white {\n color: var(--color-white);\n}\n.uppercase {\n text-transform: uppercase;\n}\n.italic {\n font-style: italic;\n}\n.no-underline {\n text-decoration-line: none;\n}\n.opacity-0 {\n opacity: 0%;\n}\n.opacity-50 {\n opacity: 50%;\n}\n.ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-2xl {\n --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-\\[\\.\\.\\.\\] {\n --tw-shadow: ...;\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-\\[0_12px_48px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\] {\n --tw-shadow: 0 12px 48px var(--tw-shadow-color, rgba(0,0,0,0.12));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.ring-blue-500 {\n --tw-ring-color: var(--color-blue-500);\n}\n.ring-offset-2 {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n}\n.blur-\\[96px\\] {\n --tw-blur: blur(96px);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n}\n.invert {\n --tw-invert: invert(100%);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n}\n.filter {\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n}\n.backdrop-blur-2xl {\n --tw-backdrop-blur: blur(var(--blur-2xl));\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n}\n.backdrop-blur-lg {\n --tw-backdrop-blur: blur(var(--blur-lg));\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n}\n.backdrop-blur-xl {\n --tw-backdrop-blur: blur(var(--blur-xl));\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n}\n.backdrop-saturate-150 {\n --tw-backdrop-saturate: saturate(150%);\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n}\n.transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n}\n.duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n}\n.duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n}\n.outline-none {\n --tw-outline-style: none;\n outline-style: none;\n}\n.select-none {\n -webkit-user-select: none;\n user-select: none;\n}\n.group-hover\\:text-green-600 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n color: var(--color-green-600);\n }\n }\n}\n.hover\\:translate-y-1 {\n &:hover {\n @media (hover: hover) {\n --tw-translate-y: calc(var(--spacing) * 1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n }\n}\n.hover\\:scale-105 {\n &:hover {\n @media (hover: hover) {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n }\n}\n.hover\\:border-blue-300 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-300);\n }\n }\n}\n.hover\\:border-blue-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-blue-400);\n }\n }\n}\n.hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-gray-400);\n }\n }\n}\n.hover\\:border-green-500 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-green-500);\n }\n }\n}\n.hover\\:border-slate-300\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-slate-300) 60%, transparent);\n }\n }\n}\n.hover\\:border-slate-600 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--color-slate-600);\n }\n }\n}\n.hover\\:border-white\\/50 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-white) 50%, transparent);\n }\n }\n}\n.hover\\:border-white\\/60 {\n &:hover {\n @media (hover: hover) {\n border-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n}\n.hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n}\n.hover\\:bg-blue-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-50);\n }\n }\n}\n.hover\\:bg-blue-200\\/70 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-blue-200) 70%, transparent);\n }\n }\n}\n.hover\\:bg-blue-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-600);\n }\n }\n}\n.hover\\:bg-blue-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-blue-700);\n }\n }\n}\n.hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-200);\n }\n }\n}\n.hover\\:bg-gray-300 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-300);\n }\n }\n}\n.hover\\:bg-orange-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-orange-600);\n }\n }\n}\n.hover\\:bg-red-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-50);\n }\n }\n}\n.hover\\:bg-red-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-red-200);\n }\n }\n}\n.hover\\:bg-slate-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-50);\n }\n }\n}\n.hover\\:bg-slate-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-slate-700);\n }\n }\n}\n.hover\\:bg-white {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-white);\n }\n }\n}\n.hover\\:bg-white\\/60 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 60%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 80%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/85 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 85%, transparent);\n }\n }\n}\n.hover\\:bg-white\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in oklab, var(--color-white) 90%, transparent);\n }\n }\n}\n.hover\\:from-blue-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-from: var(--color-blue-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:to-gray-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-to: var(--color-gray-100);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n }\n}\n.hover\\:text-blue-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-600);\n }\n }\n}\n.hover\\:text-blue-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-blue-700);\n }\n }\n}\n.hover\\:text-green-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-green-700);\n }\n }\n}\n.hover\\:text-red-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-600);\n }\n }\n}\n.hover\\:text-red-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-red-700);\n }\n }\n}\n.hover\\:text-slate-100 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-slate-100);\n }\n }\n}\n.hover\\:text-slate-900 {\n &:hover {\n @media (hover: hover) {\n color: var(--color-slate-900);\n }\n }\n}\n.hover\\:ring-2 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-2xl {\n &:hover {\n @media (hover: hover) {\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 }\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_20px_48px_-12px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.06\\)\\,inset_0_1px_0_rgba\\(255\\,255\\,255\\,1\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 48px -12px var(--tw-shadow-color, rgba(0,0,0,0.15)), 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.06)), inset 0 1px 0 var(--tw-shadow-color, rgba(255,255,255,1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-lg {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:shadow-xl {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.hover\\:ring-gray-300 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-color: var(--color-gray-300);\n }\n }\n}\n.focus\\:border-blue-400 {\n &:focus {\n border-color: var(--color-blue-400);\n }\n}\n.focus\\:ring-1 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.focus\\:ring-blue-400 {\n &:focus {\n --tw-ring-color: var(--color-blue-400);\n }\n}\n.focus\\:ring-blue-500 {\n &:focus {\n --tw-ring-color: var(--color-blue-500);\n }\n}\n.focus\\:ring-slate-500 {\n &:focus {\n --tw-ring-color: var(--color-slate-500);\n }\n}\n.focus\\:ring-offset-2 {\n &:focus {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n}\n.focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n}\n.active\\:bg-slate-600 {\n &:active {\n background-color: var(--color-slate-600);\n }\n}\n.disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n}\n.disabled\\:opacity-40 {\n &:disabled {\n opacity: 40%;\n }\n}\n.disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n}\n.min-\\[445px\\]\\:inline {\n @media (width >= 445px) {\n display: inline;\n }\n}\n.sm\\:grid-cols-2 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.md\\:mt-4 {\n @media (width >= 48rem) {\n margin-top: calc(var(--spacing) * 4);\n }\n}\n.md\\:w-80 {\n @media (width >= 48rem) {\n width: calc(var(--spacing) * 80);\n }\n}\n.md\\:max-w-\\[75vw\\] {\n @media (width >= 48rem) {\n max-width: 75vw;\n }\n}\n.md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.md\\:grid-cols-3 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n}\n.md\\:flex-row {\n @media (width >= 48rem) {\n flex-direction: row;\n }\n}\n.md\\:px-12 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--spacing) * 12);\n }\n}\n.md\\:text-5xl {\n @media (width >= 48rem) {\n font-size: var(--text-5xl);\n line-height: var(--tw-leading, var(--text-5xl--line-height));\n }\n}\n.lg\\:mt-6 {\n @media (width >= 64rem) {\n margin-top: calc(var(--spacing) * 6);\n }\n}\n.lg\\:block {\n @media (width >= 64rem) {\n display: block;\n }\n}\n.lg\\:flex {\n @media (width >= 64rem) {\n display: flex;\n }\n}\n.lg\\:hidden {\n @media (width >= 64rem) {\n display: none;\n }\n}\n.lg\\:h-4 {\n @media (width >= 64rem) {\n height: calc(var(--spacing) * 4);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-11rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 11rem);\n }\n}\n.lg\\:max-h-\\[calc\\(100dvh-20rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 20rem);\n }\n}\n.lg\\:w-4 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 4);\n }\n}\n.lg\\:w-72 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 72);\n }\n}\n.lg\\:w-90 {\n @media (width >= 64rem) {\n width: calc(var(--spacing) * 90);\n }\n}\n.lg\\:max-w-full {\n @media (width >= 64rem) {\n max-width: 100%;\n }\n}\n.lg\\:grid-cols-2 {\n @media (width >= 64rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.lg\\:flex-row {\n @media (width >= 64rem) {\n flex-direction: row;\n }\n}\n.lg\\:items-center {\n @media (width >= 64rem) {\n align-items: center;\n }\n}\n.lg\\:justify-center {\n @media (width >= 64rem) {\n justify-content: center;\n }\n}\n.lg\\:gap-2 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 2);\n }\n}\n.lg\\:gap-3 {\n @media (width >= 64rem) {\n gap: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-3 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 3);\n }\n}\n.lg\\:px-4 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 4);\n }\n}\n.lg\\:px-6 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--spacing) * 6);\n }\n}\n.lg\\:py-2 {\n @media (width >= 64rem) {\n padding-block: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pr-2 {\n @media (width >= 64rem) {\n padding-right: calc(var(--spacing) * 2);\n }\n}\n.lg\\:pb-4 {\n @media (width >= 64rem) {\n padding-bottom: calc(var(--spacing) * 4);\n }\n}\n.lg\\:text-2xl {\n @media (width >= 64rem) {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n}\n.lg\\:text-9xl {\n @media (width >= 64rem) {\n font-size: var(--text-9xl);\n line-height: var(--tw-leading, var(--text-9xl--line-height));\n }\n}\n.lg\\:text-sm {\n @media (width >= 64rem) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:max-h-none {\n & .edit-panel-container {\n max-height: none;\n }\n}\n.\\[\\&_\\.edit-panel-container\\]\\:overflow-visible {\n & .edit-panel-container {\n overflow: visible;\n }\n}\n:root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji';\n --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --color-red-50: oklch(97.1% 0.013 17.38);\n --color-red-100: oklch(93.6% 0.032 17.717);\n --color-red-200: oklch(88.5% 0.062 18.334);\n --color-red-300: oklch(80.8% 0.114 19.571);\n --color-red-400: oklch(70.4% 0.191 22.216);\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-red-600: oklch(57.7% 0.245 27.325);\n --color-red-700: oklch(50.5% 0.213 27.518);\n --color-red-800: oklch(44.4% 0.177 26.899);\n --color-red-900: oklch(39.6% 0.141 25.723);\n --color-red-950: oklch(25.8% 0.092 26.042);\n --color-orange-50: oklch(98% 0.016 73.684);\n --color-orange-100: oklch(95.4% 0.038 75.164);\n --color-orange-200: oklch(90.1% 0.076 70.697);\n --color-orange-300: oklch(83.7% 0.128 66.29);\n --color-orange-400: oklch(75% 0.183 55.934);\n --color-orange-500: oklch(70.5% 0.213 47.604);\n --color-orange-600: oklch(64.6% 0.222 41.116);\n --color-orange-700: oklch(55.3% 0.195 38.402);\n --color-orange-800: oklch(47% 0.157 37.304);\n --color-orange-900: oklch(40.8% 0.123 38.172);\n --color-orange-950: oklch(26.6% 0.079 36.259);\n --color-amber-50: oklch(98.7% 0.022 95.277);\n --color-amber-100: oklch(96.2% 0.059 95.617);\n --color-amber-200: oklch(92.4% 0.12 95.746);\n --color-amber-300: oklch(87.9% 0.169 91.605);\n --color-amber-400: oklch(82.8% 0.189 84.429);\n --color-amber-500: oklch(76.9% 0.188 70.08);\n --color-amber-600: oklch(66.6% 0.179 58.318);\n --color-amber-700: oklch(55.5% 0.163 48.998);\n --color-amber-800: oklch(47.3% 0.137 46.201);\n --color-amber-900: oklch(41.4% 0.112 45.904);\n --color-amber-950: oklch(27.9% 0.077 45.635);\n --color-yellow-50: oklch(98.7% 0.026 102.212);\n --color-yellow-100: oklch(97.3% 0.071 103.193);\n --color-yellow-200: oklch(94.5% 0.129 101.54);\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-400: oklch(85.2% 0.199 91.936);\n --color-yellow-500: oklch(79.5% 0.184 86.047);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-yellow-700: oklch(55.4% 0.135 66.442);\n --color-yellow-800: oklch(47.6% 0.114 61.907);\n --color-yellow-900: oklch(42.1% 0.095 57.708);\n --color-yellow-950: oklch(28.6% 0.066 53.813);\n --color-lime-50: oklch(98.6% 0.031 120.757);\n --color-lime-100: oklch(96.7% 0.067 122.328);\n --color-lime-200: oklch(93.8% 0.127 124.321);\n --color-lime-300: oklch(89.7% 0.196 126.665);\n --color-lime-400: oklch(84.1% 0.238 128.85);\n --color-lime-500: oklch(76.8% 0.233 130.85);\n --color-lime-600: oklch(64.8% 0.2 131.684);\n --color-lime-700: oklch(53.2% 0.157 131.589);\n --color-lime-800: oklch(45.3% 0.124 130.933);\n --color-lime-900: oklch(40.5% 0.101 131.063);\n --color-lime-950: oklch(27.4% 0.072 132.109);\n --color-green-50: oklch(98.2% 0.018 155.826);\n --color-green-100: oklch(96.2% 0.044 156.743);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-300: oklch(87.1% 0.15 154.449);\n --color-green-400: oklch(79.2% 0.209 151.711);\n --color-green-500: oklch(72.3% 0.219 149.579);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-green-700: oklch(52.7% 0.154 150.069);\n --color-green-800: oklch(44.8% 0.119 151.328);\n --color-green-900: oklch(39.3% 0.095 152.535);\n --color-green-950: oklch(26.6% 0.065 152.934);\n --color-emerald-50: oklch(97.9% 0.021 166.113);\n --color-emerald-100: oklch(95% 0.052 163.051);\n --color-emerald-200: oklch(90.5% 0.093 164.15);\n --color-emerald-300: oklch(84.5% 0.143 164.978);\n --color-emerald-400: oklch(76.5% 0.177 163.223);\n --color-emerald-500: oklch(69.6% 0.17 162.48);\n --color-emerald-600: oklch(59.6% 0.145 163.225);\n --color-emerald-700: oklch(50.8% 0.118 165.612);\n --color-emerald-800: oklch(43.2% 0.095 166.913);\n --color-emerald-900: oklch(37.8% 0.077 168.94);\n --color-emerald-950: oklch(26.2% 0.051 172.552);\n --color-teal-50: oklch(98.4% 0.014 180.72);\n --color-teal-100: oklch(95.3% 0.051 180.801);\n --color-teal-200: oklch(91% 0.096 180.426);\n --color-teal-300: oklch(85.5% 0.138 181.071);\n --color-teal-400: oklch(77.7% 0.152 181.912);\n --color-teal-500: oklch(70.4% 0.14 182.503);\n --color-teal-600: oklch(60% 0.118 184.704);\n --color-teal-700: oklch(51.1% 0.096 186.391);\n --color-teal-800: oklch(43.7% 0.078 188.216);\n --color-teal-900: oklch(38.6% 0.063 188.416);\n --color-teal-950: oklch(27.7% 0.046 192.524);\n --color-cyan-50: oklch(98.4% 0.019 200.873);\n --color-cyan-100: oklch(95.6% 0.045 203.388);\n --color-cyan-200: oklch(91.7% 0.08 205.041);\n --color-cyan-300: oklch(86.5% 0.127 207.078);\n --color-cyan-400: oklch(78.9% 0.154 211.53);\n --color-cyan-500: oklch(71.5% 0.143 215.221);\n --color-cyan-600: oklch(60.9% 0.126 221.723);\n --color-cyan-700: oklch(52% 0.105 223.128);\n --color-cyan-800: oklch(45% 0.085 224.283);\n --color-cyan-900: oklch(39.8% 0.07 227.392);\n --color-cyan-950: oklch(30.2% 0.056 229.695);\n --color-sky-50: oklch(97.7% 0.013 236.62);\n --color-sky-100: oklch(95.1% 0.026 236.824);\n --color-sky-200: oklch(90.1% 0.058 230.902);\n --color-sky-300: oklch(82.8% 0.111 230.318);\n --color-sky-400: oklch(74.6% 0.16 232.661);\n --color-sky-500: oklch(68.5% 0.169 237.323);\n --color-sky-600: oklch(58.8% 0.158 241.966);\n --color-sky-700: oklch(50% 0.134 242.749);\n --color-sky-800: oklch(44.3% 0.11 240.79);\n --color-sky-900: oklch(39.1% 0.09 240.876);\n --color-sky-950: oklch(29.3% 0.066 243.157);\n --color-blue-50: oklch(97% 0.014 254.604);\n --color-blue-100: oklch(93.2% 0.032 255.585);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-300: oklch(80.9% 0.105 251.813);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-blue-500: oklch(62.3% 0.214 259.815);\n --color-blue-600: oklch(54.6% 0.245 262.881);\n --color-blue-700: oklch(48.8% 0.243 264.376);\n --color-blue-800: oklch(42.4% 0.199 265.638);\n --color-blue-900: oklch(37.9% 0.146 265.522);\n --color-blue-950: oklch(28.2% 0.091 267.935);\n --color-indigo-50: oklch(96.2% 0.018 272.314);\n --color-indigo-100: oklch(93% 0.034 272.788);\n --color-indigo-200: oklch(87% 0.065 274.039);\n --color-indigo-300: oklch(78.5% 0.115 274.713);\n --color-indigo-400: oklch(67.3% 0.182 276.935);\n --color-indigo-500: oklch(58.5% 0.233 277.117);\n --color-indigo-600: oklch(51.1% 0.262 276.966);\n --color-indigo-700: oklch(45.7% 0.24 277.023);\n --color-indigo-800: oklch(39.8% 0.195 277.366);\n --color-indigo-900: oklch(35.9% 0.144 278.697);\n --color-indigo-950: oklch(25.7% 0.09 281.288);\n --color-violet-50: oklch(96.9% 0.016 293.756);\n --color-violet-100: oklch(94.3% 0.029 294.588);\n --color-violet-200: oklch(89.4% 0.057 293.283);\n --color-violet-300: oklch(81.1% 0.111 293.571);\n --color-violet-400: oklch(70.2% 0.183 293.541);\n --color-violet-500: oklch(60.6% 0.25 292.717);\n --color-violet-600: oklch(54.1% 0.281 293.009);\n --color-violet-700: oklch(49.1% 0.27 292.581);\n --color-violet-800: oklch(43.2% 0.232 292.759);\n --color-violet-900: oklch(38% 0.189 293.745);\n --color-violet-950: oklch(28.3% 0.141 291.089);\n --color-purple-50: oklch(97.7% 0.014 308.299);\n --color-purple-100: oklch(94.6% 0.033 307.174);\n --color-purple-200: oklch(90.2% 0.063 306.703);\n --color-purple-300: oklch(82.7% 0.119 306.383);\n --color-purple-400: oklch(71.4% 0.203 305.504);\n --color-purple-500: oklch(62.7% 0.265 303.9);\n --color-purple-600: oklch(55.8% 0.288 302.321);\n --color-purple-700: oklch(49.6% 0.265 301.924);\n --color-purple-800: oklch(43.8% 0.218 303.724);\n --color-purple-900: oklch(38.1% 0.176 304.987);\n --color-purple-950: oklch(29.1% 0.149 302.717);\n --color-fuchsia-50: oklch(97.7% 0.017 320.058);\n --color-fuchsia-100: oklch(95.2% 0.037 318.852);\n --color-fuchsia-200: oklch(90.3% 0.076 319.62);\n --color-fuchsia-300: oklch(83.3% 0.145 321.434);\n --color-fuchsia-400: oklch(74% 0.238 322.16);\n --color-fuchsia-500: oklch(66.7% 0.295 322.15);\n --color-fuchsia-600: oklch(59.1% 0.293 322.896);\n --color-fuchsia-700: oklch(51.8% 0.253 323.949);\n --color-fuchsia-800: oklch(45.2% 0.211 324.591);\n --color-fuchsia-900: oklch(40.1% 0.17 325.612);\n --color-fuchsia-950: oklch(29.3% 0.136 325.661);\n --color-pink-50: oklch(97.1% 0.014 343.198);\n --color-pink-100: oklch(94.8% 0.028 342.258);\n --color-pink-200: oklch(89.9% 0.061 343.231);\n --color-pink-300: oklch(82.3% 0.12 346.018);\n --color-pink-400: oklch(71.8% 0.202 349.761);\n --color-pink-500: oklch(65.6% 0.241 354.308);\n --color-pink-600: oklch(59.2% 0.249 0.584);\n --color-pink-700: oklch(52.5% 0.223 3.958);\n --color-pink-800: oklch(45.9% 0.187 3.815);\n --color-pink-900: oklch(40.8% 0.153 2.432);\n --color-pink-950: oklch(28.4% 0.109 3.907);\n --color-rose-50: oklch(96.9% 0.015 12.422);\n --color-rose-100: oklch(94.1% 0.03 12.58);\n --color-rose-200: oklch(89.2% 0.058 10.001);\n --color-rose-300: oklch(81% 0.117 11.638);\n --color-rose-400: oklch(71.2% 0.194 13.428);\n --color-rose-500: oklch(64.5% 0.246 16.439);\n --color-rose-600: oklch(58.6% 0.253 17.585);\n --color-rose-700: oklch(51.4% 0.222 16.935);\n --color-rose-800: oklch(45.5% 0.188 13.697);\n --color-rose-900: oklch(41% 0.159 10.272);\n --color-rose-950: oklch(27.1% 0.105 12.094);\n --color-slate-50: oklch(98.4% 0.003 247.858);\n --color-slate-100: oklch(96.8% 0.007 247.896);\n --color-slate-200: oklch(92.9% 0.013 255.508);\n --color-slate-300: oklch(86.9% 0.022 252.894);\n --color-slate-400: oklch(70.4% 0.04 256.788);\n --color-slate-500: oklch(55.4% 0.046 257.417);\n --color-slate-600: oklch(44.6% 0.043 257.281);\n --color-slate-700: oklch(37.2% 0.044 257.287);\n --color-slate-800: oklch(27.9% 0.041 260.031);\n --color-slate-900: oklch(20.8% 0.042 265.755);\n --color-slate-950: oklch(12.9% 0.042 264.695);\n --color-gray-50: oklch(98.5% 0.002 247.839);\n --color-gray-100: oklch(96.7% 0.003 264.542);\n --color-gray-200: oklch(92.8% 0.006 264.531);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-500: oklch(55.1% 0.027 264.364);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-gray-700: oklch(37.3% 0.034 259.733);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-gray-900: oklch(21% 0.034 264.665);\n --color-gray-950: oklch(13% 0.028 261.692);\n --color-zinc-50: oklch(98.5% 0 0);\n --color-zinc-100: oklch(96.7% 0.001 286.375);\n --color-zinc-200: oklch(92% 0.004 286.32);\n --color-zinc-300: oklch(87.1% 0.006 286.286);\n --color-zinc-400: oklch(70.5% 0.015 286.067);\n --color-zinc-500: oklch(55.2% 0.016 285.938);\n --color-zinc-600: oklch(44.2% 0.017 285.786);\n --color-zinc-700: oklch(37% 0.013 285.805);\n --color-zinc-800: oklch(27.4% 0.006 286.033);\n --color-zinc-900: oklch(21% 0.006 285.885);\n --color-zinc-950: oklch(14.1% 0.005 285.823);\n --color-neutral-50: oklch(98.5% 0 0);\n --color-neutral-100: oklch(97% 0 0);\n --color-neutral-200: oklch(92.2% 0 0);\n --color-neutral-300: oklch(87% 0 0);\n --color-neutral-400: oklch(70.8% 0 0);\n --color-neutral-500: oklch(55.6% 0 0);\n --color-neutral-600: oklch(43.9% 0 0);\n --color-neutral-700: oklch(37.1% 0 0);\n --color-neutral-800: oklch(26.9% 0 0);\n --color-neutral-900: oklch(20.5% 0 0);\n --color-neutral-950: oklch(14.5% 0 0);\n --color-stone-50: oklch(98.5% 0.001 106.423);\n --color-stone-100: oklch(97% 0.001 106.424);\n --color-stone-200: oklch(92.3% 0.003 48.717);\n --color-stone-300: oklch(86.9% 0.005 56.366);\n --color-stone-400: oklch(70.9% 0.01 56.259);\n --color-stone-500: oklch(55.3% 0.013 58.071);\n --color-stone-600: oklch(44.4% 0.011 73.639);\n --color-stone-700: oklch(37.4% 0.01 67.558);\n --color-stone-800: oklch(26.8% 0.007 34.298);\n --color-stone-900: oklch(21.6% 0.006 56.043);\n --color-stone-950: oklch(14.7% 0.004 49.25);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n --container-3xs: 16rem;\n --container-2xs: 18rem;\n --container-xs: 20rem;\n --container-sm: 24rem;\n --container-md: 28rem;\n --container-lg: 32rem;\n --container-xl: 36rem;\n --container-2xl: 42rem;\n --container-3xl: 48rem;\n --container-4xl: 56rem;\n --container-5xl: 64rem;\n --container-6xl: 72rem;\n --container-7xl: 80rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --text-3xl: 1.875rem;\n --text-3xl--line-height: calc(2.25 / 1.875);\n --text-4xl: 2.25rem;\n --text-4xl--line-height: calc(2.5 / 2.25);\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 6rem;\n --text-8xl--line-height: 1;\n --text-9xl: 8rem;\n --text-9xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-extralight: 200;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-extrabold: 800;\n --font-weight-black: 900;\n --tracking-tighter: -0.05em;\n --tracking-tight: -0.025em;\n --tracking-normal: 0em;\n --tracking-wide: 0.025em;\n --tracking-wider: 0.05em;\n --tracking-widest: 0.1em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-normal: 1.5;\n --leading-relaxed: 1.625;\n --leading-loose: 2;\n --radius-xs: 0.125rem;\n --radius-sm: 0.25rem;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --radius-xl: 0.75rem;\n --radius-2xl: 1rem;\n --radius-3xl: 1.5rem;\n --radius-4xl: 2rem;\n --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);\n --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);\n --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);\n --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);\n --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);\n --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);\n --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);\n --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);\n --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);\n --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);\n --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);\n --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);\n --text-shadow-sm: 0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);\n --text-shadow-md: 0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);\n --text-shadow-lg: 0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;\n --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --animate-bounce: bounce 1s infinite;\n --blur-xs: 4px;\n --blur-sm: 8px;\n --blur-md: 12px;\n --blur-lg: 16px;\n --blur-xl: 24px;\n --blur-2xl: 40px;\n --blur-3xl: 64px;\n --perspective-dramatic: 100px;\n --perspective-near: 300px;\n --perspective-normal: 500px;\n --perspective-midrange: 800px;\n --perspective-distant: 1200px;\n --aspect-video: 16 / 9;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji';\n --default-font-feature-settings: initial;\n --default-font-variation-settings: initial;\n --default-mono-font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --default-mono-font-feature-settings: initial;\n --default-mono-font-variation-settings: initial;\n --font-titillium: \"Titillium Web\", sans-serif;\n}\ndiv:focus-visible, button:focus-visible {\n outline: none;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root {\n color-scheme: dark;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-white {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-50 {\n background-color: #2B3036 !important;\n}\n[data-bs-theme=\"dark\"] .qb-editor-root .bg-gray-100 {\n background-color: #363c42 !important;\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateX(0);\n}\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateY(0);\n}\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: rotateZ(0);\n}\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false;\n initial-value: skewX(0);\n}\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false;\n initial-value: skewY(0);\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes ping {\n 75%, 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes bounce {\n 0%, 100% {\n transform: translateY(-25%);\n animation-timing-function: cubic-bezier(0.8, 0, 1, 1);\n }\n 50% {\n transform: none;\n animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n }\n}\n";
8
+ style.textContent = "/*! tailwindcss v4.1.18 | 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:root, :host {\n --mie-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n monospace;\n --mie-color-blue-500: oklch(62.3% 0.214 259.815);\n --mie-color-blue-600: oklch(54.6% 0.245 262.881);\n --mie-color-gray-200: oklch(92.8% 0.006 264.531);\n --mie-color-gray-900: oklch(21% 0.034 264.665);\n --mie-color-white: #fff;\n --mie-spacing: 0.25rem;\n --mie-container-md: 28rem;\n --mie-container-xl: 36rem;\n --mie-container-4xl: 56rem;\n --mie-container-7xl: 80rem;\n --mie-text-xs: 0.75rem;\n --mie-text-xs--line-height: calc(1 / 0.75);\n --mie-text-sm: 0.875rem;\n --mie-text-sm--line-height: calc(1.25 / 0.875);\n --mie-text-base: 1rem;\n --mie-text-base--line-height: calc(1.5 / 1);\n --mie-text-lg: 1.125rem;\n --mie-text-lg--line-height: calc(1.75 / 1.125);\n --mie-text-xl: 1.25rem;\n --mie-text-xl--line-height: calc(1.75 / 1.25);\n --mie-font-weight-light: 300;\n --mie-font-weight-normal: 400;\n --mie-font-weight-medium: 500;\n --mie-font-weight-semibold: 600;\n --mie-tracking-wide: 0.025em;\n --mie-leading-relaxed: 1.625;\n --mie-radius-md: 0.375rem;\n --mie-radius-lg: 0.5rem;\n --mie-radius-xl: 0.75rem;\n --mie-radius-2xl: 1rem;\n --mie-default-transition-duration: 150ms;\n --mie-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --mie-font-titillium: \"Titillium Web\", sans-serif;\n --mie-color-mieprimary: #3b82f6;\n --mie-color-miesecondary: #6b7280;\n --mie-color-mieaccent: #10b981;\n --mie-color-miedanger: #ef4444;\n --mie-color-miewarning: #f97316;\n --mie-color-miesurface: #ffffff;\n --mie-color-mieborder: #e5e7eb;\n --mie-color-mieborderinactive: #9ca3af;\n --mie-color-mietext: #111827;\n --mie-color-mietextsecondary: #f8fafc;\n --mie-color-mietextmuted: #6b7280;\n --mie-color-miebackground: #f9fafb;\n --mie-color-miebackgroundsecondary: #f3f4f6;\n --mie-color-miebackgroundhover: #eceef1;\n --mie-color-mieoverlay: rgba(0, 0, 0, 0.5);\n}\n.mie\\:pointer-events-none {\n pointer-events: none;\n}\n.mie\\:absolute {\n position: absolute;\n}\n.mie\\:fixed {\n position: fixed;\n}\n.mie\\:relative {\n position: relative;\n}\n.mie\\:sticky {\n position: sticky;\n}\n.mie\\:inset-0 {\n inset: calc(var(--mie-spacing) * 0);\n}\n.mie\\:top-0 {\n top: calc(var(--mie-spacing) * 0);\n}\n.mie\\:top-1\\/2 {\n top: calc(1/2 * 100%);\n}\n.mie\\:top-2 {\n top: calc(var(--mie-spacing) * 2);\n}\n.mie\\:top-3 {\n top: calc(var(--mie-spacing) * 3);\n}\n.mie\\:top-11 {\n top: calc(var(--mie-spacing) * 11);\n}\n.mie\\:right-0 {\n right: calc(var(--mie-spacing) * 0);\n}\n.mie\\:right-2 {\n right: calc(var(--mie-spacing) * 2);\n}\n.mie\\:right-3 {\n right: calc(var(--mie-spacing) * 3);\n}\n.mie\\:bottom-0 {\n bottom: calc(var(--mie-spacing) * 0);\n}\n.mie\\:bottom-5 {\n bottom: calc(var(--mie-spacing) * 5);\n}\n.mie\\:bottom-full {\n bottom: 100%;\n}\n.mie\\:-left-2 {\n left: calc(var(--mie-spacing) * -2);\n}\n.mie\\:left-0 {\n left: calc(var(--mie-spacing) * 0);\n}\n.mie\\:left-5 {\n left: calc(var(--mie-spacing) * 5);\n}\n.mie\\:z-10 {\n z-index: 10;\n}\n.mie\\:z-20 {\n z-index: 20;\n}\n.mie\\:z-40 {\n z-index: 40;\n}\n.mie\\:z-50 {\n z-index: 50;\n}\n.mie\\:z-9999 {\n z-index: 9999;\n}\n.mie\\:m-0 {\n margin: calc(var(--mie-spacing) * 0);\n}\n.mie\\:-mx-6 {\n margin-inline: calc(var(--mie-spacing) * -6);\n}\n.mie\\:mx-4 {\n margin-inline: calc(var(--mie-spacing) * 4);\n}\n.mie\\:mx-auto {\n margin-inline: auto;\n}\n.mie\\:my-2 {\n margin-block: calc(var(--mie-spacing) * 2);\n}\n.mie\\:my-9 {\n margin-block: calc(var(--mie-spacing) * 9);\n}\n.mie\\:-mt-6 {\n margin-top: calc(var(--mie-spacing) * -6);\n}\n.mie\\:mt-1 {\n margin-top: calc(var(--mie-spacing) * 1);\n}\n.mie\\:mt-2 {\n margin-top: calc(var(--mie-spacing) * 2);\n}\n.mie\\:mt-3 {\n margin-top: calc(var(--mie-spacing) * 3);\n}\n.mie\\:mt-4 {\n margin-top: calc(var(--mie-spacing) * 4);\n}\n.mie\\:mb-1 {\n margin-bottom: calc(var(--mie-spacing) * 1);\n}\n.mie\\:mb-1\\.5 {\n margin-bottom: calc(var(--mie-spacing) * 1.5);\n}\n.mie\\:mb-2 {\n margin-bottom: calc(var(--mie-spacing) * 2);\n}\n.mie\\:mb-3 {\n margin-bottom: calc(var(--mie-spacing) * 3);\n}\n.mie\\:mb-4 {\n margin-bottom: calc(var(--mie-spacing) * 4);\n}\n.mie\\:mb-6 {\n margin-bottom: calc(var(--mie-spacing) * 6);\n}\n.mie\\:ml-2 {\n margin-left: calc(var(--mie-spacing) * 2);\n}\n.mie\\:ml-auto {\n margin-left: auto;\n}\n.mie\\:block {\n display: block;\n}\n.mie\\:flex {\n display: flex;\n}\n.mie\\:grid {\n display: grid;\n}\n.mie\\:hidden {\n display: none;\n}\n.mie\\:inline-flex {\n display: inline-flex;\n}\n.mie\\:h-1 {\n height: calc(var(--mie-spacing) * 1);\n}\n.mie\\:h-3 {\n height: calc(var(--mie-spacing) * 3);\n}\n.mie\\:h-3\\.5 {\n height: calc(var(--mie-spacing) * 3.5);\n}\n.mie\\:h-4 {\n height: calc(var(--mie-spacing) * 4);\n}\n.mie\\:h-5 {\n height: calc(var(--mie-spacing) * 5);\n}\n.mie\\:h-6 {\n height: calc(var(--mie-spacing) * 6);\n}\n.mie\\:h-7 {\n height: calc(var(--mie-spacing) * 7);\n}\n.mie\\:h-8 {\n height: calc(var(--mie-spacing) * 8);\n}\n.mie\\:h-10 {\n height: calc(var(--mie-spacing) * 10);\n}\n.mie\\:h-11 {\n height: calc(var(--mie-spacing) * 11);\n}\n.mie\\:h-12 {\n height: calc(var(--mie-spacing) * 12);\n}\n.mie\\:h-24 {\n height: calc(var(--mie-spacing) * 24);\n}\n.mie\\:h-72 {\n height: calc(var(--mie-spacing) * 72);\n}\n.mie\\:h-auto {\n height: auto;\n}\n.mie\\:h-fit {\n height: fit-content;\n}\n.mie\\:h-full {\n height: 100%;\n}\n.mie\\:max-h-32 {\n max-height: calc(var(--mie-spacing) * 32);\n}\n.mie\\:max-h-48 {\n max-height: calc(var(--mie-spacing) * 48);\n}\n.mie\\:max-h-56 {\n max-height: calc(var(--mie-spacing) * 56);\n}\n.mie\\:max-h-60 {\n max-height: calc(var(--mie-spacing) * 60);\n}\n.mie\\:max-h-64 {\n max-height: calc(var(--mie-spacing) * 64);\n}\n.mie\\:max-h-75 {\n max-height: calc(var(--mie-spacing) * 75);\n}\n.mie\\:max-h-\\[60vh\\] {\n max-height: 60vh;\n}\n.mie\\:max-h-\\[calc\\(100svh-13rem\\)\\] {\n max-height: calc(100svh - 13rem);\n}\n.mie\\:max-h-\\[calc\\(100svh-24rem\\)\\] {\n max-height: calc(100svh - 24rem);\n}\n.mie\\:max-h-none {\n max-height: none;\n}\n.mie\\:max-h-screen {\n max-height: 100vh;\n}\n.mie\\:min-h-10 {\n min-height: calc(var(--mie-spacing) * 10);\n}\n.mie\\:min-h-24 {\n min-height: calc(var(--mie-spacing) * 24);\n}\n.mie\\:min-h-64 {\n min-height: calc(var(--mie-spacing) * 64);\n}\n.mie\\:w-1\\/2 {\n width: calc(1/2 * 100%);\n}\n.mie\\:w-3 {\n width: calc(var(--mie-spacing) * 3);\n}\n.mie\\:w-3\\.5 {\n width: calc(var(--mie-spacing) * 3.5);\n}\n.mie\\:w-3\\/4 {\n width: calc(3/4 * 100%);\n}\n.mie\\:w-4 {\n width: calc(var(--mie-spacing) * 4);\n}\n.mie\\:w-5 {\n width: calc(var(--mie-spacing) * 5);\n}\n.mie\\:w-6 {\n width: calc(var(--mie-spacing) * 6);\n}\n.mie\\:w-7 {\n width: calc(var(--mie-spacing) * 7);\n}\n.mie\\:w-8 {\n width: calc(var(--mie-spacing) * 8);\n}\n.mie\\:w-12 {\n width: calc(var(--mie-spacing) * 12);\n}\n.mie\\:w-20 {\n width: calc(var(--mie-spacing) * 20);\n}\n.mie\\:w-32 {\n width: calc(var(--mie-spacing) * 32);\n}\n.mie\\:w-fit {\n width: fit-content;\n}\n.mie\\:w-full {\n width: 100%;\n}\n.mie\\:w-px {\n width: 1px;\n}\n.mie\\:max-w-4xl {\n max-width: var(--mie-container-4xl);\n}\n.mie\\:max-w-7xl {\n max-width: var(--mie-container-7xl);\n}\n.mie\\:max-w-\\[80vw\\] {\n max-width: 80vw;\n}\n.mie\\:max-w-full {\n max-width: 100%;\n}\n.mie\\:max-w-md {\n max-width: var(--mie-container-md);\n}\n.mie\\:max-w-xl {\n max-width: var(--mie-container-xl);\n}\n.mie\\:min-w-0 {\n min-width: calc(var(--mie-spacing) * 0);\n}\n.mie\\:min-w-\\[44px\\] {\n min-width: 44px;\n}\n.mie\\:flex-1 {\n flex: 1;\n}\n.mie\\:shrink-0 {\n flex-shrink: 0;\n}\n.mie\\:-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.mie\\: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.mie\\:rotate-180 {\n rotate: 180deg;\n}\n.mie\\:cursor-not-allowed {\n cursor: not-allowed;\n}\n.mie\\:cursor-pointer {\n cursor: pointer;\n}\n.mie\\:touch-manipulation {\n touch-action: manipulation;\n}\n.mie\\:resize-y {\n resize: vertical;\n}\n.mie\\:appearance-none {\n appearance: none;\n}\n.mie\\:grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.mie\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.mie\\:flex-col {\n flex-direction: column;\n}\n.mie\\:flex-wrap {\n flex-wrap: wrap;\n}\n.mie\\:items-center {\n align-items: center;\n}\n.mie\\:items-end {\n align-items: flex-end;\n}\n.mie\\:items-start {\n align-items: flex-start;\n}\n.mie\\:justify-between {\n justify-content: space-between;\n}\n.mie\\:justify-center {\n justify-content: center;\n}\n.mie\\:justify-end {\n justify-content: flex-end;\n}\n.mie\\:justify-evenly {\n justify-content: space-evenly;\n}\n.mie\\:justify-start {\n justify-content: flex-start;\n}\n.mie\\:gap-0 {\n gap: calc(var(--mie-spacing) * 0);\n}\n.mie\\:gap-1 {\n gap: calc(var(--mie-spacing) * 1);\n}\n.mie\\:gap-1\\.5 {\n gap: calc(var(--mie-spacing) * 1.5);\n}\n.mie\\:gap-2 {\n gap: calc(var(--mie-spacing) * 2);\n}\n.mie\\:gap-3 {\n gap: calc(var(--mie-spacing) * 3);\n}\n.mie\\:gap-4 {\n gap: calc(var(--mie-spacing) * 4);\n}\n.mie\\:space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--mie-spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--mie-spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.mie\\:space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--mie-spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--mie-spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.mie\\:space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--mie-spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--mie-spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.mie\\:space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--mie-spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--mie-spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n}\n.mie\\:truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.mie\\:overflow-auto {\n overflow: auto;\n}\n.mie\\:overflow-hidden {\n overflow: hidden;\n}\n.mie\\:overflow-visible {\n overflow: visible;\n}\n.mie\\:overflow-y-auto {\n overflow-y: auto;\n}\n.mie\\:rounded {\n border-radius: 0.25rem;\n}\n.mie\\:rounded-2xl {\n border-radius: var(--mie-radius-2xl);\n}\n.mie\\:rounded-full {\n border-radius: calc(infinity * 1px);\n}\n.mie\\:rounded-lg {\n border-radius: var(--mie-radius-lg);\n}\n.mie\\:rounded-md {\n border-radius: var(--mie-radius-md);\n}\n.mie\\:rounded-xl {\n border-radius: var(--mie-radius-xl);\n}\n.mie\\:rounded-t-2xl {\n border-top-left-radius: var(--mie-radius-2xl);\n border-top-right-radius: var(--mie-radius-2xl);\n}\n.mie\\:rounded-t-lg {\n border-top-left-radius: var(--mie-radius-lg);\n border-top-right-radius: var(--mie-radius-lg);\n}\n.mie\\:border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n}\n.mie\\:border-0 {\n border-style: var(--tw-border-style);\n border-width: 0px;\n}\n.mie\\:border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n}\n.mie\\:border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n}\n.mie\\:border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n}\n.mie\\:border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n}\n.mie\\:border-gray-200 {\n border-color: var(--mie-color-gray-200);\n}\n.mie\\:border-mieborder {\n border-color: var(--mie-color-mieborder);\n}\n.mie\\:border-mieborderinactive {\n border-color: var(--mie-color-mieborderinactive);\n}\n.mie\\:border-miedanger\\/30 {\n border-color: var(--mie-color-miedanger);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-miedanger) 30%, transparent);\n }\n}\n.mie\\:border-miedanger\\/50 {\n border-color: var(--mie-color-miedanger);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-miedanger) 50%, transparent);\n }\n}\n.mie\\:border-mieprimary {\n border-color: var(--mie-color-mieprimary);\n}\n.mie\\:border-mieprimary\\/30 {\n border-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-mieprimary) 30%, transparent);\n }\n}\n.mie\\:border-mieprimary\\/50 {\n border-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-mieprimary) 50%, transparent);\n }\n}\n.mie\\:border-miewarning {\n border-color: var(--mie-color-miewarning);\n}\n.mie\\:border-transparent {\n border-color: transparent;\n}\n.mie\\:bg-blue-500 {\n background-color: var(--mie-color-blue-500);\n}\n.mie\\:bg-miebackground {\n background-color: var(--mie-color-miebackground);\n}\n.mie\\:bg-miebackgroundsecondary {\n background-color: var(--mie-color-miebackgroundsecondary);\n}\n.mie\\:bg-mieborder {\n background-color: var(--mie-color-mieborder);\n}\n.mie\\:bg-miedanger\\/10 {\n background-color: var(--mie-color-miedanger);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-miedanger) 10%, transparent);\n }\n}\n.mie\\:bg-mieoverlay {\n background-color: var(--mie-color-mieoverlay);\n}\n.mie\\:bg-mieprimary {\n background-color: var(--mie-color-mieprimary);\n}\n.mie\\:bg-mieprimary\\/10 {\n background-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-mieprimary) 10%, transparent);\n }\n}\n.mie\\:bg-mieprimary\\/20 {\n background-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-mieprimary) 20%, transparent);\n }\n}\n.mie\\:bg-miesurface {\n background-color: var(--mie-color-miesurface);\n}\n.mie\\:bg-mietext {\n background-color: var(--mie-color-mietext);\n}\n.mie\\:bg-miewarning {\n background-color: var(--mie-color-miewarning);\n}\n.mie\\:bg-miewarning\\/10 {\n background-color: var(--mie-color-miewarning);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-miewarning) 10%, transparent);\n }\n}\n.mie\\:bg-transparent {\n background-color: transparent;\n}\n.mie\\:bg-white {\n background-color: var(--mie-color-white);\n}\n.mie\\:bg-linear-to-br {\n --tw-gradient-position: to bottom right;\n @supports (background-image: linear-gradient(in lab, red, red)) {\n --tw-gradient-position: to bottom right in oklab;\n }\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.mie\\:from-miebackground {\n --tw-gradient-from: var(--mie-color-miebackground);\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.mie\\:from-mieprimary\\/10 {\n --tw-gradient-from: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-gradient-from: color-mix(in oklab, var(--mie-color-mieprimary) 10%, transparent);\n }\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.mie\\:to-miebackground {\n --tw-gradient-to: var(--mie-color-miebackground);\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.mie\\:to-mieborder\\/30 {\n --tw-gradient-to: var(--mie-color-mieborder);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-gradient-to: color-mix(in oklab, var(--mie-color-mieborder) 30%, transparent);\n }\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.mie\\:object-contain {\n object-fit: contain;\n}\n.mie\\:p-0 {\n padding: calc(var(--mie-spacing) * 0);\n}\n.mie\\:p-1 {\n padding: calc(var(--mie-spacing) * 1);\n}\n.mie\\:p-1\\.5 {\n padding: calc(var(--mie-spacing) * 1.5);\n}\n.mie\\:p-2 {\n padding: calc(var(--mie-spacing) * 2);\n}\n.mie\\:p-3 {\n padding: calc(var(--mie-spacing) * 3);\n}\n.mie\\:p-4 {\n padding: calc(var(--mie-spacing) * 4);\n}\n.mie\\:p-6 {\n padding: calc(var(--mie-spacing) * 6);\n}\n.mie\\:p-8 {\n padding: calc(var(--mie-spacing) * 8);\n}\n.mie\\:px-0 {\n padding-inline: calc(var(--mie-spacing) * 0);\n}\n.mie\\:px-0\\.5 {\n padding-inline: calc(var(--mie-spacing) * 0.5);\n}\n.mie\\:px-2 {\n padding-inline: calc(var(--mie-spacing) * 2);\n}\n.mie\\:px-2\\.5 {\n padding-inline: calc(var(--mie-spacing) * 2.5);\n}\n.mie\\:px-3 {\n padding-inline: calc(var(--mie-spacing) * 3);\n}\n.mie\\:px-4 {\n padding-inline: calc(var(--mie-spacing) * 4);\n}\n.mie\\:px-6 {\n padding-inline: calc(var(--mie-spacing) * 6);\n}\n.mie\\:px-8 {\n padding-inline: calc(var(--mie-spacing) * 8);\n}\n.mie\\:py-0\\.5 {\n padding-block: calc(var(--mie-spacing) * 0.5);\n}\n.mie\\:py-1 {\n padding-block: calc(var(--mie-spacing) * 1);\n}\n.mie\\:py-1\\.5 {\n padding-block: calc(var(--mie-spacing) * 1.5);\n}\n.mie\\:py-2 {\n padding-block: calc(var(--mie-spacing) * 2);\n}\n.mie\\:py-2\\.5 {\n padding-block: calc(var(--mie-spacing) * 2.5);\n}\n.mie\\:py-3 {\n padding-block: calc(var(--mie-spacing) * 3);\n}\n.mie\\:py-4 {\n padding-block: calc(var(--mie-spacing) * 4);\n}\n.mie\\:py-5 {\n padding-block: calc(var(--mie-spacing) * 5);\n}\n.mie\\:py-10 {\n padding-block: calc(var(--mie-spacing) * 10);\n}\n.mie\\:pt-1 {\n padding-top: calc(var(--mie-spacing) * 1);\n}\n.mie\\:pt-2 {\n padding-top: calc(var(--mie-spacing) * 2);\n}\n.mie\\:pt-3 {\n padding-top: calc(var(--mie-spacing) * 3);\n}\n.mie\\:pt-4 {\n padding-top: calc(var(--mie-spacing) * 4);\n}\n.mie\\:pt-6 {\n padding-top: calc(var(--mie-spacing) * 6);\n}\n.mie\\:pr-10 {\n padding-right: calc(var(--mie-spacing) * 10);\n}\n.mie\\:pr-16 {\n padding-right: calc(var(--mie-spacing) * 16);\n}\n.mie\\:pb-2 {\n padding-bottom: calc(var(--mie-spacing) * 2);\n}\n.mie\\:pb-4 {\n padding-bottom: calc(var(--mie-spacing) * 4);\n}\n.mie\\:pb-8 {\n padding-bottom: calc(var(--mie-spacing) * 8);\n}\n.mie\\:pl-32 {\n padding-left: calc(var(--mie-spacing) * 32);\n}\n.mie\\:text-center {\n text-align: center;\n}\n.mie\\:text-left {\n text-align: left;\n}\n.mie\\:font-mono {\n font-family: var(--mie-font-mono);\n}\n.mie\\:font-titillium {\n font-family: var(--mie-font-titillium);\n}\n.mie\\:text-base {\n font-size: var(--mie-text-base);\n line-height: var(--tw-leading, var(--mie-text-base--line-height));\n}\n.mie\\:text-lg {\n font-size: var(--mie-text-lg);\n line-height: var(--tw-leading, var(--mie-text-lg--line-height));\n}\n.mie\\:text-sm {\n font-size: var(--mie-text-sm);\n line-height: var(--tw-leading, var(--mie-text-sm--line-height));\n}\n.mie\\:text-xl {\n font-size: var(--mie-text-xl);\n line-height: var(--tw-leading, var(--mie-text-xl--line-height));\n}\n.mie\\:text-xs {\n font-size: var(--mie-text-xs);\n line-height: var(--tw-leading, var(--mie-text-xs--line-height));\n}\n.mie\\:leading-relaxed {\n --tw-leading: var(--mie-leading-relaxed);\n line-height: var(--mie-leading-relaxed);\n}\n.mie\\:font-light {\n --tw-font-weight: var(--mie-font-weight-light);\n font-weight: var(--mie-font-weight-light);\n}\n.mie\\:font-medium {\n --tw-font-weight: var(--mie-font-weight-medium);\n font-weight: var(--mie-font-weight-medium);\n}\n.mie\\:font-normal {\n --tw-font-weight: var(--mie-font-weight-normal);\n font-weight: var(--mie-font-weight-normal);\n}\n.mie\\:font-semibold {\n --tw-font-weight: var(--mie-font-weight-semibold);\n font-weight: var(--mie-font-weight-semibold);\n}\n.mie\\:tracking-wide {\n --tw-tracking: var(--mie-tracking-wide);\n letter-spacing: var(--mie-tracking-wide);\n}\n.mie\\:wrap-break-word {\n overflow-wrap: break-word;\n}\n.mie\\:whitespace-nowrap {\n white-space: nowrap;\n}\n.mie\\:whitespace-pre-line {\n white-space: pre-line;\n}\n.mie\\:text-gray-900 {\n color: var(--mie-color-gray-900);\n}\n.mie\\:text-mieborder {\n color: var(--mie-color-mieborder);\n}\n.mie\\:text-miedanger {\n color: var(--mie-color-miedanger);\n}\n.mie\\:text-mieprimary {\n color: var(--mie-color-mieprimary);\n}\n.mie\\:text-miesurface {\n color: var(--mie-color-miesurface);\n}\n.mie\\:text-mietext {\n color: var(--mie-color-mietext);\n}\n.mie\\:text-mietextmuted {\n color: var(--mie-color-mietextmuted);\n}\n.mie\\:text-mietextmuted\\/50 {\n color: var(--mie-color-mietextmuted);\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, var(--mie-color-mietextmuted) 50%, transparent);\n }\n}\n.mie\\:text-mietextmuted\\/70 {\n color: var(--mie-color-mietextmuted);\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, var(--mie-color-mietextmuted) 70%, transparent);\n }\n}\n.mie\\:text-mietextsecondary {\n color: var(--mie-color-mietextsecondary);\n}\n.mie\\:text-miewarning {\n color: var(--mie-color-miewarning);\n}\n.mie\\:uppercase {\n text-transform: uppercase;\n}\n.mie\\:italic {\n font-style: italic;\n}\n.mie\\:accent-mieprimary {\n accent-color: var(--mie-color-mieprimary);\n}\n.mie\\:opacity-0 {\n opacity: 0%;\n}\n.mie\\:opacity-50 {\n opacity: 50%;\n}\n.mie\\: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.mie\\: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.mie\\: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.mie\\: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.mie\\: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.mie\\:ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n.mie\\:ring-mieprimary {\n --tw-ring-color: var(--mie-color-mieprimary);\n}\n.mie\\:ring-offset-2 {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n}\n.mie\\: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(--mie-default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--mie-default-transition-duration));\n}\n.mie\\:transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--mie-default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--mie-default-transition-duration));\n}\n.mie\\: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(--mie-default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--mie-default-transition-duration));\n}\n.mie\\:transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--mie-default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--mie-default-transition-duration));\n}\n.mie\\:duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n}\n.mie\\:outline-none {\n --tw-outline-style: none;\n outline-style: none;\n}\n.mie\\:select-none {\n -webkit-user-select: none;\n user-select: none;\n}\n.mie\\:group-hover\\:text-mietextsecondary {\n &:is(:where(.mie\\:group):hover *) {\n @media (hover: hover) {\n color: var(--mie-color-mietextsecondary);\n }\n }\n}\n.mie\\:placeholder\\:text-mietextmuted {\n &::placeholder {\n color: var(--mie-color-mietextmuted);\n }\n}\n.mie\\:hover\\:flex {\n &:hover {\n @media (hover: hover) {\n display: flex;\n }\n }\n}\n.mie\\: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.mie\\:hover\\:border-mieprimary {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-mieprimary);\n }\n }\n}\n.mie\\:hover\\:border-mieprimary\\/50 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-mieprimary) 50%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:border-mietextmuted {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-mietextmuted);\n }\n }\n}\n.mie\\:hover\\:bg-blue-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-blue-600);\n }\n }\n}\n.mie\\:hover\\:bg-miebackground {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miebackground);\n }\n }\n}\n.mie\\:hover\\:bg-miebackgroundhover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miebackgroundhover);\n }\n }\n}\n.mie\\:hover\\:bg-mieborder {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-mieborder);\n }\n }\n}\n.mie\\:hover\\:bg-miedanger\\/10 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miedanger);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-miedanger) 10%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-miedanger\\/20 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miedanger);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-miedanger) 20%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-mieprimary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-mieprimary);\n }\n }\n}\n.mie\\:hover\\:bg-mieprimary\\/10 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-mieprimary) 10%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-mieprimary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-mieprimary) 80%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-mieprimary\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-mieprimary) 90%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-miesurface {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miesurface);\n }\n }\n}\n.mie\\:hover\\:bg-miewarning\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-miewarning);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-miewarning) 90%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:from-mieprimary\\/20 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-from: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-gradient-from: color-mix(in oklab, var(--mie-color-mieprimary) 20%, transparent);\n }\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.mie\\:hover\\:to-miebackground {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-to: var(--mie-color-miebackground);\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.mie\\:hover\\:text-miedanger {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-miedanger);\n }\n }\n}\n.mie\\:hover\\:text-mieprimary {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-mieprimary);\n }\n }\n}\n.mie\\:hover\\:text-mietext {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-mietext);\n }\n }\n}\n.mie\\:hover\\:text-mietextsecondary {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-mietextsecondary);\n }\n }\n}\n.mie\\: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.mie\\:hover\\:ring-2 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n.mie\\:hover\\:ring-mieborder {\n &:hover {\n @media (hover: hover) {\n --tw-ring-color: var(--mie-color-mieborder);\n }\n }\n}\n.mie\\:focus\\:border-mieprimary {\n &:focus {\n border-color: var(--mie-color-mieprimary);\n }\n}\n.mie\\: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.mie\\:focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n}\n.mie\\:focus\\:ring-mieprimary {\n &:focus {\n --tw-ring-color: var(--mie-color-mieprimary);\n }\n}\n.mie\\:focus\\:ring-mieprimary\\/30 {\n &:focus {\n --tw-ring-color: var(--mie-color-mieprimary);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--mie-color-mieprimary) 30%, transparent);\n }\n }\n}\n.mie\\:focus\\:ring-offset-2 {\n &:focus {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n}\n.mie\\:focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n}\n.mie\\:disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n}\n.mie\\:disabled\\:opacity-40 {\n &:disabled {\n opacity: 40%;\n }\n}\n.mie\\:disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n}\n.mie\\:sm\\:grid-cols-2 {\n @media (width >= 40rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.mie\\:md\\:w-80 {\n @media (width >= 48rem) {\n width: calc(var(--mie-spacing) * 80);\n }\n}\n.mie\\:md\\:max-w-\\[75vw\\] {\n @media (width >= 48rem) {\n max-width: 75vw;\n }\n}\n.mie\\:md\\:flex-row {\n @media (width >= 48rem) {\n flex-direction: row;\n }\n}\n.mie\\:md\\:px-6 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--mie-spacing) * 6);\n }\n}\n.mie\\:lg\\:block {\n @media (width >= 64rem) {\n display: block;\n }\n}\n.mie\\:lg\\:flex {\n @media (width >= 64rem) {\n display: flex;\n }\n}\n.mie\\:lg\\:hidden {\n @media (width >= 64rem) {\n display: none;\n }\n}\n.mie\\:lg\\:h-4 {\n @media (width >= 64rem) {\n height: calc(var(--mie-spacing) * 4);\n }\n}\n.mie\\:lg\\:max-h-\\[calc\\(100dvh-11rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 11rem);\n }\n}\n.mie\\:lg\\:max-h-\\[calc\\(100dvh-20rem\\)\\] {\n @media (width >= 64rem) {\n max-height: calc(100dvh - 20rem);\n }\n}\n.mie\\:lg\\:w-4 {\n @media (width >= 64rem) {\n width: calc(var(--mie-spacing) * 4);\n }\n}\n.mie\\:lg\\:w-72 {\n @media (width >= 64rem) {\n width: calc(var(--mie-spacing) * 72);\n }\n}\n.mie\\:lg\\:w-90 {\n @media (width >= 64rem) {\n width: calc(var(--mie-spacing) * 90);\n }\n}\n.mie\\:lg\\:max-w-full {\n @media (width >= 64rem) {\n max-width: 100%;\n }\n}\n.mie\\:lg\\:grid-cols-2 {\n @media (width >= 64rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n.mie\\:lg\\:flex-row {\n @media (width >= 64rem) {\n flex-direction: row;\n }\n}\n.mie\\:lg\\:items-center {\n @media (width >= 64rem) {\n align-items: center;\n }\n}\n.mie\\:lg\\:justify-center {\n @media (width >= 64rem) {\n justify-content: center;\n }\n}\n.mie\\:lg\\:gap-2 {\n @media (width >= 64rem) {\n gap: calc(var(--mie-spacing) * 2);\n }\n}\n.mie\\:lg\\:gap-3 {\n @media (width >= 64rem) {\n gap: calc(var(--mie-spacing) * 3);\n }\n}\n.mie\\:lg\\:px-3 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--mie-spacing) * 3);\n }\n}\n.mie\\:lg\\:px-4 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--mie-spacing) * 4);\n }\n}\n.mie\\:lg\\:px-6 {\n @media (width >= 64rem) {\n padding-inline: calc(var(--mie-spacing) * 6);\n }\n}\n.mie\\:lg\\:py-2 {\n @media (width >= 64rem) {\n padding-block: calc(var(--mie-spacing) * 2);\n }\n}\n.mie\\:lg\\:pr-2 {\n @media (width >= 64rem) {\n padding-right: calc(var(--mie-spacing) * 2);\n }\n}\n.mie\\:lg\\:pb-4 {\n @media (width >= 64rem) {\n padding-bottom: calc(var(--mie-spacing) * 4);\n }\n}\n.mie\\:lg\\:text-sm {\n @media (width >= 64rem) {\n font-size: var(--mie-text-sm);\n line-height: var(--tw-leading, var(--mie-text-sm--line-height));\n }\n}\n@layer base {\n .qb-editor-root, .qb-editor-root *, .qb-editor-root *::before, .qb-editor-root *::after {\n box-sizing: border-box;\n border-width: 0;\n border-style: solid;\n border-color: currentColor;\n }\n .qb-editor-root {\n font-family: \"Titillium Web\", ui-sans-serif, system-ui, sans-serif;\n }\n .qb-editor-root input, .qb-editor-root textarea, .qb-editor-root select, .qb-editor-root button {\n font-family: inherit;\n font-size: inherit;\n }\n}\ndiv:focus-visible, button:focus-visible {\n outline: none;\n}\n.qb-editor-root.dark {\n --mie-color-mieprimary: #6b7fa3;\n --mie-color-miesecondary: #9ca3af;\n --mie-color-mieaccent: #34d399;\n --mie-color-miedanger: #f87171;\n --mie-color-miewarning: #fb923c;\n --mie-color-miesurface: #252526;\n --mie-color-mieborder: #3c3c3c;\n --mie-color-mieborderinactive: #5a5a5a;\n --mie-color-mietext: #d4d4d4;\n --mie-color-mietextsecondary: #1e1e1e;\n --mie-color-mietextmuted: #808080;\n --mie-color-miebackground: #1e1e1e;\n --mie-color-miebackgroundsecondary: #252526;\n --mie-color-miebackgroundhover: #2a2d2e;\n --mie-color-mieoverlay: rgba(0, 0, 0, 0.7);\n}\n.mie\\:custom-scrollbar::-webkit-scrollbar {\n width: 4px;\n}\n.mie\\:custom-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n}\n.mie\\:custom-scrollbar::-webkit-scrollbar-thumb {\n background: transparent;\n border-radius: 9999px;\n transition: background 0.2s;\n}\n.mie\\:custom-scrollbar:hover::-webkit-scrollbar-thumb {\n background: #d1d5db;\n}\n.mie\\:custom-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n}\n.mie\\:custom-scrollbar:hover {\n scrollbar-color: #d1d5db transparent;\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-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-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 m, { useCallback as ke, useMemo as Be, memo as Ge, useState as Pe, useRef as Q, useEffect as le } from "react";
14
- import { useFormStore as ae, useFormData as Ot, useAlert as Tt, useUIApi as ie, VEDITOR_ICON as dr, CODE_ICON as fr, PICTURE_ICON as mr, UPLOAD_ICON as hr, DOWNLOAD_ICON as pr, parseAndDetect as Ae, adaptSchema as _e, fieldTypes as de, TOOLS_ICON as gr, X_ICON as br, PAPERCLIP_ICON as vr, MATRIX_ICON as xr, RANKING_ICON as yr, SELECTINPUT_ICON as jr, FOLDERS_ICON as wr, TEXTINPUT_ICON as Er, TRASHCANTWO_ICON as ye, useFormApi as Ke, FormStoreContext as Xe, ARROWDOWN_ICON as Cr, NUMERIC_EXPRESSION_FORMATS as Nr, EDIT_ICON as Or, EYEEDIT_ICON as Tr, useVisibleFields as Sr, useUIStore as Ir, getFieldComponent as Rr, MIE_FORMS_SCHEMA_TYPE as ze, createFormStore as kr, createUIStore as Pr, AlertProvider as Ar, UIStoreContext as _r } from "@mieweb/forms-engine";
15
- import Te from "js-yaml";
16
- import { useStore as Mr } from "zustand";
17
- var Se = { exports: {} }, ge = {};
18
- /**
19
- * @license React
20
- * react-jsx-runtime.production.min.js
21
- *
22
- * Copyright (c) Facebook, Inc. and its affiliates.
23
- *
24
- * This source code is licensed under the MIT license found in the
25
- * LICENSE file in the root directory of this source tree.
26
- */
27
- var mt;
28
- function Fr() {
29
- if (mt) return ge;
30
- mt = 1;
31
- var e = m, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), a = Object.prototype.hasOwnProperty, o = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, i = { key: !0, ref: !0, __self: !0, __source: !0 };
32
- function h(l, u, p) {
33
- var v, x = {}, P = null, A = null;
34
- p !== void 0 && (P = "" + p), u.key !== void 0 && (P = "" + u.key), u.ref !== void 0 && (A = u.ref);
35
- for (v in u) a.call(u, v) && !i.hasOwnProperty(v) && (x[v] = u[v]);
36
- if (l && l.defaultProps) for (v in u = l.defaultProps, u) x[v] === void 0 && (x[v] = u[v]);
37
- return { $$typeof: r, type: l, key: P, ref: A, props: x, _owner: o.current };
13
+ import l, { useCallback as de, useMemo as Ee, memo as Ce, useState as ue, useRef as U, useEffect as J } from "react";
14
+ import { useFormStore as V, useFormData as $e, useAlert as Ue, useUIApi as B, VEDITOR_ICON as tt, CODE_ICON as it, PICTURE_ICON as rt, UPLOAD_ICON as nt, DOWNLOAD_ICON as st, parseAndDetect as fe, adaptSchema as pe, fieldTypes as K, TOOLS_ICON as ot, X_ICON as at, PAPERCLIP_ICON as mt, MATRIX_ICON as lt, RANKING_ICON as ct, SELECTINPUT_ICON as dt, FOLDERS_ICON as ut, TEXTINPUT_ICON as ft, CustomCheckbox as pt, TRASHCANTWO_ICON as re, useFormApi as Ne, FormStoreContext as Oe, ARROWDOWN_ICON as ht, NUMERIC_EXPRESSION_FORMATS as xt, EDIT_ICON as bt, EYEEDIT_ICON as gt, useVisibleFields as vt, useUIStore as yt, getFieldComponent as jt, MIE_FORMS_SCHEMA_TYPE as ve, createFormStore as wt, createUIStore as Et, UIStoreContext as Nt, AlertProvider as Ct } from "@mieweb/forms-engine";
15
+ import ae from "js-yaml";
16
+ import { useStore as Ot } from "zustand";
17
+ var me = { exports: {} }, Z = {};
18
+ var Te;
19
+ function Tt() {
20
+ if (Te) return Z;
21
+ Te = 1;
22
+ var e = /* @__PURE__ */ Symbol.for("react.transitional.element"), i = /* @__PURE__ */ Symbol.for("react.fragment");
23
+ function r(n, s, o) {
24
+ var d = null;
25
+ if (o !== void 0 && (d = "" + o), s.key !== void 0 && (d = "" + s.key), "key" in s) {
26
+ o = {};
27
+ for (var m in s)
28
+ m !== "key" && (o[m] = s[m]);
29
+ } else o = s;
30
+ return s = o.ref, {
31
+ $$typeof: e,
32
+ type: n,
33
+ key: d,
34
+ ref: s !== void 0 ? s : null,
35
+ props: o
36
+ };
38
37
  }
39
- return ge.Fragment = n, ge.jsx = h, ge.jsxs = h, ge;
40
- }
41
- var be = {};
42
- /**
43
- * @license React
44
- * react-jsx-runtime.development.js
45
- *
46
- * Copyright (c) Facebook, Inc. and its affiliates.
47
- *
48
- * This source code is licensed under the MIT license found in the
49
- * LICENSE file in the root directory of this source tree.
50
- */
51
- var ht;
52
- function Dr() {
53
- return ht || (ht = 1, process.env.NODE_ENV !== "production" && (function() {
54
- var e = m, r = Symbol.for("react.element"), n = Symbol.for("react.portal"), a = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), i = Symbol.for("react.profiler"), h = Symbol.for("react.provider"), l = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), v = Symbol.for("react.suspense_list"), x = Symbol.for("react.memo"), P = Symbol.for("react.lazy"), A = Symbol.for("react.offscreen"), z = Symbol.iterator, E = "@@iterator";
55
- function F(s) {
56
- if (s === null || typeof s != "object")
57
- return null;
58
- var d = z && s[z] || s[E];
59
- return typeof d == "function" ? d : null;
60
- }
61
- var R = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
62
- function j(s) {
63
- {
64
- for (var d = arguments.length, b = new Array(d > 1 ? d - 1 : 0), O = 1; O < d; O++)
65
- b[O - 1] = arguments[O];
66
- L("error", s, b);
67
- }
68
- }
69
- function L(s, d, b) {
70
- {
71
- var O = R.ReactDebugCurrentFrame, q = O.getStackAddendum();
72
- q !== "" && (d += "%s", b = b.concat([q]));
73
- var U = b.map(function(M) {
74
- return String(M);
75
- });
76
- U.unshift("Warning: " + d), Function.prototype.apply.call(console[s], console, U);
77
- }
78
- }
79
- var I = !1, f = !1, C = !1, g = !1, D = !1, T;
80
- T = Symbol.for("react.module.reference");
81
- function N(s) {
82
- return !!(typeof s == "string" || typeof s == "function" || s === a || s === i || D || s === o || s === p || s === v || g || s === A || I || f || C || typeof s == "object" && s !== null && (s.$$typeof === P || s.$$typeof === x || s.$$typeof === h || s.$$typeof === l || s.$$typeof === u || // This needs to include all possible module reference object
83
- // types supported by any Flight configuration anywhere since
84
- // we don't know which Flight build this will end up being used
85
- // with.
86
- s.$$typeof === T || s.getModuleId !== void 0));
87
- }
88
- function V(s, d, b) {
89
- var O = s.displayName;
90
- if (O)
91
- return O;
92
- var q = d.displayName || d.name || "";
93
- return q !== "" ? b + "(" + q + ")" : b;
94
- }
95
- function H(s) {
96
- return s.displayName || "Context";
97
- }
98
- function G(s) {
99
- if (s == null)
100
- return null;
101
- if (typeof s.tag == "number" && j("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof s == "function")
102
- return s.displayName || s.name || null;
103
- if (typeof s == "string")
104
- return s;
105
- switch (s) {
106
- case a:
38
+ return Z.Fragment = i, Z.jsx = r, Z.jsxs = r, Z;
39
+ }
40
+ var ee = {};
41
+ var Ie;
42
+ function It() {
43
+ return Ie || (Ie = 1, process.env.NODE_ENV !== "production" && (function() {
44
+ function e(a) {
45
+ if (a == null) return null;
46
+ if (typeof a == "function")
47
+ return a.$$typeof === P ? null : a.displayName || a.name || null;
48
+ if (typeof a == "string") return a;
49
+ switch (a) {
50
+ case O:
107
51
  return "Fragment";
108
- case n:
109
- return "Portal";
110
- case i:
52
+ case j:
111
53
  return "Profiler";
112
- case o:
54
+ case R:
113
55
  return "StrictMode";
114
- case p:
56
+ case x:
115
57
  return "Suspense";
116
- case v:
58
+ case f:
117
59
  return "SuspenseList";
60
+ case k:
61
+ return "Activity";
118
62
  }
119
- if (typeof s == "object")
120
- switch (s.$$typeof) {
121
- case l:
122
- var d = s;
123
- return H(d) + ".Consumer";
124
- case h:
125
- var b = s;
126
- return H(b._context) + ".Provider";
127
- case u:
128
- return V(s, s.render, "ForwardRef");
129
- case x:
130
- var O = s.displayName || null;
131
- return O !== null ? O : G(s.type) || "Memo";
132
- case P: {
133
- var q = s, U = q._payload, M = q._init;
63
+ if (typeof a == "object")
64
+ switch (typeof a.tag == "number" && console.error(
65
+ "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
66
+ ), a.$$typeof) {
67
+ case N:
68
+ return "Portal";
69
+ case S:
70
+ return a.displayName || "Context";
71
+ case I:
72
+ return (a._context.displayName || "Context") + ".Consumer";
73
+ case b:
74
+ var v = a.render;
75
+ return a = a.displayName, a || (a = v.displayName || v.name || "", a = a !== "" ? "ForwardRef(" + a + ")" : "ForwardRef"), a;
76
+ case T:
77
+ return v = a.displayName || null, v !== null ? v : e(a.type) || "Memo";
78
+ case w:
79
+ v = a._payload, a = a._init;
134
80
  try {
135
- return G(M(U));
81
+ return e(a(v));
136
82
  } catch {
137
- return null;
138
83
  }
139
- }
140
84
  }
141
85
  return null;
142
86
  }
143
- var B = Object.assign, c = 0, w, S, X, W, Z, y, _;
144
- function Y() {
145
- }
146
- Y.__reactDisabledLog = !0;
147
- function oe() {
148
- {
149
- if (c === 0) {
150
- w = console.log, S = console.info, X = console.warn, W = console.error, Z = console.group, y = console.groupCollapsed, _ = console.groupEnd;
151
- var s = {
152
- configurable: !0,
153
- enumerable: !0,
154
- value: Y,
155
- writable: !0
156
- };
157
- Object.defineProperties(console, {
158
- info: s,
159
- log: s,
160
- warn: s,
161
- error: s,
162
- group: s,
163
- groupCollapsed: s,
164
- groupEnd: s
165
- });
166
- }
167
- c++;
168
- }
169
- }
170
- function te() {
171
- {
172
- if (c--, c === 0) {
173
- var s = {
174
- configurable: !0,
175
- enumerable: !0,
176
- writable: !0
177
- };
178
- Object.defineProperties(console, {
179
- log: B({}, s, {
180
- value: w
181
- }),
182
- info: B({}, s, {
183
- value: S
184
- }),
185
- warn: B({}, s, {
186
- value: X
187
- }),
188
- error: B({}, s, {
189
- value: W
190
- }),
191
- group: B({}, s, {
192
- value: Z
193
- }),
194
- groupCollapsed: B({}, s, {
195
- value: y
196
- }),
197
- groupEnd: B({}, s, {
198
- value: _
199
- })
200
- });
201
- }
202
- c < 0 && j("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
203
- }
204
- }
205
- var $ = R.ReactCurrentDispatcher, De;
206
- function Ee(s, d, b) {
207
- {
208
- if (De === void 0)
209
- try {
210
- throw Error();
211
- } catch (q) {
212
- var O = q.stack.trim().match(/\n( *(at )?)/);
213
- De = O && O[1] || "";
214
- }
215
- return `
216
- ` + De + s;
217
- }
218
- }
219
- var Le = !1, Ce;
220
- {
221
- var qt = typeof WeakMap == "function" ? WeakMap : Map;
222
- Ce = new qt();
87
+ function i(a) {
88
+ return "" + a;
223
89
  }
224
- function Qe(s, d) {
225
- if (!s || Le)
226
- return "";
227
- {
228
- var b = Ce.get(s);
229
- if (b !== void 0)
230
- return b;
231
- }
232
- var O;
233
- Le = !0;
234
- var q = Error.prepareStackTrace;
235
- Error.prepareStackTrace = void 0;
236
- var U;
237
- U = $.current, $.current = null, oe();
90
+ function r(a) {
238
91
  try {
239
- if (d) {
240
- var M = function() {
241
- throw Error();
242
- };
243
- if (Object.defineProperty(M.prototype, "props", {
244
- set: function() {
245
- throw Error();
246
- }
247
- }), typeof Reflect == "object" && Reflect.construct) {
248
- try {
249
- Reflect.construct(M, []);
250
- } catch (re) {
251
- O = re;
252
- }
253
- Reflect.construct(s, [], M);
254
- } else {
255
- try {
256
- M.call();
257
- } catch (re) {
258
- O = re;
259
- }
260
- s.call(M.prototype);
261
- }
262
- } else {
263
- try {
264
- throw Error();
265
- } catch (re) {
266
- O = re;
267
- }
268
- s();
269
- }
270
- } catch (re) {
271
- if (re && O && typeof re.stack == "string") {
272
- for (var k = re.stack.split(`
273
- `), ee = O.stack.split(`
274
- `), J = k.length - 1, K = ee.length - 1; J >= 1 && K >= 0 && k[J] !== ee[K]; )
275
- K--;
276
- for (; J >= 1 && K >= 0; J--, K--)
277
- if (k[J] !== ee[K]) {
278
- if (J !== 1 || K !== 1)
279
- do
280
- if (J--, K--, K < 0 || k[J] !== ee[K]) {
281
- var se = `
282
- ` + k[J].replace(" at new ", " at ");
283
- return s.displayName && se.includes("<anonymous>") && (se = se.replace("<anonymous>", s.displayName)), typeof s == "function" && Ce.set(s, se), se;
284
- }
285
- while (J >= 1 && K >= 0);
286
- break;
287
- }
288
- }
289
- } finally {
290
- Le = !1, $.current = U, te(), Error.prepareStackTrace = q;
291
- }
292
- var me = s ? s.displayName || s.name : "", ue = me ? Ee(me) : "";
293
- return typeof s == "function" && Ce.set(s, ue), ue;
294
- }
295
- function Wt(s, d, b) {
296
- return Qe(s, !1);
297
- }
298
- function Vt(s) {
299
- var d = s.prototype;
300
- return !!(d && d.isReactComponent);
301
- }
302
- function Ne(s, d, b) {
303
- if (s == null)
304
- return "";
305
- if (typeof s == "function")
306
- return Qe(s, Vt(s));
307
- if (typeof s == "string")
308
- return Ee(s);
309
- switch (s) {
310
- case p:
311
- return Ee("Suspense");
312
- case v:
313
- return Ee("SuspenseList");
314
- }
315
- if (typeof s == "object")
316
- switch (s.$$typeof) {
317
- case u:
318
- return Wt(s.render);
319
- case x:
320
- return Ne(s.type, d, b);
321
- case P: {
322
- var O = s, q = O._payload, U = O._init;
323
- try {
324
- return Ne(U(q), d, b);
325
- } catch {
326
- }
327
- }
328
- }
329
- return "";
330
- }
331
- var pe = Object.prototype.hasOwnProperty, Ze = {}, et = R.ReactDebugCurrentFrame;
332
- function Oe(s) {
333
- if (s) {
334
- var d = s._owner, b = Ne(s.type, s._source, d ? d.type : null);
335
- et.setExtraStackFrame(b);
336
- } else
337
- et.setExtraStackFrame(null);
338
- }
339
- function Ut(s, d, b, O, q) {
340
- {
341
- var U = Function.call.bind(pe);
342
- for (var M in s)
343
- if (U(s, M)) {
344
- var k = void 0;
345
- try {
346
- if (typeof s[M] != "function") {
347
- var ee = Error((O || "React class") + ": " + b + " type `" + M + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof s[M] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
348
- throw ee.name = "Invariant Violation", ee;
349
- }
350
- k = s[M](d, M, O, b, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
351
- } catch (J) {
352
- k = J;
353
- }
354
- k && !(k instanceof Error) && (Oe(q), j("%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).", O || "React class", b, M, typeof k), Oe(null)), k instanceof Error && !(k.message in Ze) && (Ze[k.message] = !0, Oe(q), j("Failed %s type: %s", b, k.message), Oe(null));
355
- }
92
+ i(a);
93
+ var v = !1;
94
+ } catch {
95
+ v = !0;
356
96
  }
357
- }
358
- var zt = Array.isArray;
359
- function $e(s) {
360
- return zt(s);
361
- }
362
- function Ht(s) {
363
- {
364
- var d = typeof Symbol == "function" && Symbol.toStringTag, b = d && s[Symbol.toStringTag] || s.constructor.name || "Object";
365
- return b;
97
+ if (v) {
98
+ v = console;
99
+ var y = v.error, D = typeof Symbol == "function" && Symbol.toStringTag && a[Symbol.toStringTag] || a.constructor.name || "Object";
100
+ return y.call(
101
+ v,
102
+ "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
103
+ D
104
+ ), i(a);
366
105
  }
367
106
  }
368
- function Yt(s) {
107
+ function n(a) {
108
+ if (a === O) return "<>";
109
+ if (typeof a == "object" && a !== null && a.$$typeof === w)
110
+ return "<...>";
369
111
  try {
370
- return tt(s), !1;
112
+ var v = e(a);
113
+ return v ? "<" + v + ">" : "<...>";
371
114
  } catch {
372
- return !0;
115
+ return "<...>";
373
116
  }
374
117
  }
375
- function tt(s) {
376
- return "" + s;
377
- }
378
- function rt(s) {
379
- if (Yt(s))
380
- return j("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ht(s)), tt(s);
118
+ function s() {
119
+ var a = p.A;
120
+ return a === null ? null : a.getOwner();
381
121
  }
382
- var nt = R.ReactCurrentOwner, Jt = {
383
- key: !0,
384
- ref: !0,
385
- __self: !0,
386
- __source: !0
387
- }, st, at;
388
- function Bt(s) {
389
- if (pe.call(s, "ref")) {
390
- var d = Object.getOwnPropertyDescriptor(s, "ref").get;
391
- if (d && d.isReactWarning)
392
- return !1;
393
- }
394
- return s.ref !== void 0;
122
+ function o() {
123
+ return Error("react-stack-top-frame");
395
124
  }
396
- function Kt(s) {
397
- if (pe.call(s, "key")) {
398
- var d = Object.getOwnPropertyDescriptor(s, "key").get;
399
- if (d && d.isReactWarning)
400
- return !1;
125
+ function d(a) {
126
+ if (C.call(a, "key")) {
127
+ var v = Object.getOwnPropertyDescriptor(a, "key").get;
128
+ if (v && v.isReactWarning) return !1;
401
129
  }
402
- return s.key !== void 0;
403
- }
404
- function Gt(s, d) {
405
- typeof s.ref == "string" && nt.current;
406
- }
407
- function Xt(s, d) {
408
- {
409
- var b = function() {
410
- st || (st = !0, j("%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
- };
412
- b.isReactWarning = !0, Object.defineProperty(s, "key", {
413
- get: b,
414
- configurable: !0
415
- });
416
- }
417
- }
418
- function Qt(s, d) {
419
- {
420
- var b = function() {
421
- at || (at = !0, j("%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
- };
423
- b.isReactWarning = !0, Object.defineProperty(s, "ref", {
424
- get: b,
425
- configurable: !0
426
- });
130
+ return a.key !== void 0;
131
+ }
132
+ function m(a, v) {
133
+ function y() {
134
+ F || (F = !0, console.error(
135
+ "%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://react.dev/link/special-props)",
136
+ v
137
+ ));
427
138
  }
139
+ y.isReactWarning = !0, Object.defineProperty(a, "key", {
140
+ get: y,
141
+ configurable: !0
142
+ });
428
143
  }
429
- var Zt = function(s, d, b, O, q, U, M) {
430
- var k = {
431
- // This tag allows us to uniquely identify this as a React Element
432
- $$typeof: r,
433
- // Built-in properties that belong on the element
434
- type: s,
435
- key: d,
436
- ref: b,
437
- props: M,
438
- // Record the component responsible for creating this element.
439
- _owner: U
440
- };
441
- return k._store = {}, Object.defineProperty(k._store, "validated", {
144
+ function c() {
145
+ var a = e(this.type);
146
+ return $[a] || ($[a] = !0, console.error(
147
+ "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
148
+ )), a = this.props.ref, a !== void 0 ? a : null;
149
+ }
150
+ function u(a, v, y, D, oe, be) {
151
+ var q = y.ref;
152
+ return a = {
153
+ $$typeof: _,
154
+ type: a,
155
+ key: v,
156
+ props: y,
157
+ _owner: D
158
+ }, (q !== void 0 ? q : null) !== null ? Object.defineProperty(a, "ref", {
159
+ enumerable: !1,
160
+ get: c
161
+ }) : Object.defineProperty(a, "ref", { enumerable: !1, value: null }), a._store = {}, Object.defineProperty(a._store, "validated", {
442
162
  configurable: !1,
443
163
  enumerable: !1,
444
164
  writable: !0,
445
- value: !1
446
- }), Object.defineProperty(k, "_self", {
165
+ value: 0
166
+ }), Object.defineProperty(a, "_debugInfo", {
447
167
  configurable: !1,
448
168
  enumerable: !1,
449
- writable: !1,
450
- value: O
451
- }), Object.defineProperty(k, "_source", {
169
+ writable: !0,
170
+ value: null
171
+ }), Object.defineProperty(a, "_debugStack", {
452
172
  configurable: !1,
453
173
  enumerable: !1,
454
- writable: !1,
455
- value: q
456
- }), Object.freeze && (Object.freeze(k.props), Object.freeze(k)), k;
457
- };
458
- function er(s, d, b, O, q) {
459
- {
460
- var U, M = {}, k = null, ee = null;
461
- b !== void 0 && (rt(b), k = "" + b), Kt(d) && (rt(d.key), k = "" + d.key), Bt(d) && (ee = d.ref, Gt(d, q));
462
- for (U in d)
463
- pe.call(d, U) && !Jt.hasOwnProperty(U) && (M[U] = d[U]);
464
- if (s && s.defaultProps) {
465
- var J = s.defaultProps;
466
- for (U in J)
467
- M[U] === void 0 && (M[U] = J[U]);
468
- }
469
- if (k || ee) {
470
- var K = typeof s == "function" ? s.displayName || s.name || "Unknown" : s;
471
- k && Xt(M, K), ee && Qt(M, K);
472
- }
473
- return Zt(s, k, ee, q, O, nt.current, M);
474
- }
475
- }
476
- var qe = R.ReactCurrentOwner, ot = R.ReactDebugCurrentFrame;
477
- function fe(s) {
478
- if (s) {
479
- var d = s._owner, b = Ne(s.type, s._source, d ? d.type : null);
480
- ot.setExtraStackFrame(b);
481
- } else
482
- ot.setExtraStackFrame(null);
483
- }
484
- var We;
485
- We = !1;
486
- function Ve(s) {
487
- return typeof s == "object" && s !== null && s.$$typeof === r;
488
- }
489
- function lt() {
490
- {
491
- if (qe.current) {
492
- var s = G(qe.current.type);
493
- if (s)
494
- return `
495
-
496
- Check the render method of \`` + s + "`.";
497
- }
498
- return "";
499
- }
500
- }
501
- function tr(s) {
502
- return "";
503
- }
504
- var it = {};
505
- function rr(s) {
506
- {
507
- var d = lt();
508
- if (!d) {
509
- var b = typeof s == "string" ? s : s.displayName || s.name;
510
- b && (d = `
511
-
512
- Check the top-level render call using <` + b + ">.");
513
- }
514
- return d;
515
- }
516
- }
517
- function ct(s, d) {
518
- {
519
- if (!s._store || s._store.validated || s.key != null)
520
- return;
521
- s._store.validated = !0;
522
- var b = rr(d);
523
- if (it[b])
524
- return;
525
- it[b] = !0;
526
- var O = "";
527
- s && s._owner && s._owner !== qe.current && (O = " It was passed a child from " + G(s._owner.type) + "."), fe(s), j('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', b, O), fe(null);
528
- }
529
- }
530
- function ut(s, d) {
531
- {
532
- if (typeof s != "object")
533
- return;
534
- if ($e(s))
535
- for (var b = 0; b < s.length; b++) {
536
- var O = s[b];
537
- Ve(O) && ct(O, d);
538
- }
539
- else if (Ve(s))
540
- s._store && (s._store.validated = !0);
541
- else if (s) {
542
- var q = F(s);
543
- if (typeof q == "function" && q !== s.entries)
544
- for (var U = q.call(s), M; !(M = U.next()).done; )
545
- Ve(M.value) && ct(M.value, d);
546
- }
547
- }
548
- }
549
- function nr(s) {
550
- {
551
- var d = s.type;
552
- if (d == null || typeof d == "string")
553
- return;
554
- var b;
555
- if (typeof d == "function")
556
- b = d.propTypes;
557
- else if (typeof d == "object" && (d.$$typeof === u || // Note: Memo only checks outer props here.
558
- // Inner props are checked in the reconciler.
559
- d.$$typeof === x))
560
- b = d.propTypes;
561
- else
562
- return;
563
- if (b) {
564
- var O = G(d);
565
- Ut(b, s.props, "prop", O, s);
566
- } else if (d.PropTypes !== void 0 && !We) {
567
- We = !0;
568
- var q = G(d);
569
- j("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", q || "Unknown");
570
- }
571
- typeof d.getDefaultProps == "function" && !d.getDefaultProps.isReactClassApproved && j("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
572
- }
573
- }
574
- function sr(s) {
575
- {
576
- for (var d = Object.keys(s.props), b = 0; b < d.length; b++) {
577
- var O = d[b];
578
- if (O !== "children" && O !== "key") {
579
- fe(s), j("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", O), fe(null);
580
- break;
581
- }
582
- }
583
- s.ref !== null && (fe(s), j("Invalid attribute `ref` supplied to `React.Fragment`."), fe(null));
584
- }
585
- }
586
- var dt = {};
587
- function ft(s, d, b, O, q, U) {
588
- {
589
- var M = N(s);
590
- if (!M) {
591
- var k = "";
592
- (s === void 0 || typeof s == "object" && s !== null && Object.keys(s).length === 0) && (k += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
593
- var ee = tr();
594
- ee ? k += ee : k += lt();
595
- var J;
596
- s === null ? J = "null" : $e(s) ? J = "array" : s !== void 0 && s.$$typeof === r ? (J = "<" + (G(s.type) || "Unknown") + " />", k = " Did you accidentally export a JSX literal instead of a component?") : J = typeof s, j("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", J, k);
597
- }
598
- var K = er(s, d, b, q, U);
599
- if (K == null)
600
- return K;
601
- if (M) {
602
- var se = d.children;
603
- if (se !== void 0)
604
- if (O)
605
- if ($e(se)) {
606
- for (var me = 0; me < se.length; me++)
607
- ut(se[me], s);
608
- Object.freeze && Object.freeze(se);
609
- } else
610
- j("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
- else
612
- ut(se, s);
613
- }
614
- if (pe.call(d, "key")) {
615
- var ue = G(s), re = Object.keys(d).filter(function(ur) {
616
- return ur !== "key";
617
- }), Ue = re.length > 0 ? "{key: someKey, " + re.join(": ..., ") + ": ...}" : "{key: someKey}";
618
- if (!dt[ue + Ue]) {
619
- var cr = re.length > 0 ? "{" + re.join(": ..., ") + ": ...}" : "{}";
620
- j(`A props object containing a "key" prop is being spread into JSX:
174
+ writable: !0,
175
+ value: oe
176
+ }), Object.defineProperty(a, "_debugTask", {
177
+ configurable: !1,
178
+ enumerable: !1,
179
+ writable: !0,
180
+ value: be
181
+ }), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
182
+ }
183
+ function h(a, v, y, D, oe, be) {
184
+ var q = v.children;
185
+ if (q !== void 0)
186
+ if (D)
187
+ if (M(q)) {
188
+ for (D = 0; D < q.length; D++)
189
+ g(q[D]);
190
+ Object.freeze && Object.freeze(q);
191
+ } else
192
+ console.error(
193
+ "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
194
+ );
195
+ else g(q);
196
+ if (C.call(v, "key")) {
197
+ q = e(a);
198
+ var X = Object.keys(v).filter(function(et) {
199
+ return et !== "key";
200
+ });
201
+ D = 0 < X.length ? "{key: someKey, " + X.join(": ..., ") + ": ...}" : "{key: someKey}", Y[q + D] || (X = 0 < X.length ? "{" + X.join(": ..., ") + ": ...}" : "{}", console.error(
202
+ `A props object containing a "key" prop is being spread into JSX:
621
203
  let props = %s;
622
204
  <%s {...props} />
623
205
  React keys must be passed directly to JSX without using spread:
624
206
  let props = %s;
625
- <%s key={someKey} {...props} />`, Ue, ue, cr, ue), dt[ue + Ue] = !0;
626
- }
627
- }
628
- return s === a ? sr(K) : nr(K), K;
207
+ <%s key={someKey} {...props} />`,
208
+ D,
209
+ q,
210
+ X,
211
+ q
212
+ ), Y[q + D] = !0);
629
213
  }
214
+ if (q = null, y !== void 0 && (r(y), q = "" + y), d(v) && (r(v.key), q = "" + v.key), "key" in v) {
215
+ y = {};
216
+ for (var ge in v)
217
+ ge !== "key" && (y[ge] = v[ge]);
218
+ } else y = v;
219
+ return q && m(
220
+ y,
221
+ typeof a == "function" ? a.displayName || a.name || "Unknown" : a
222
+ ), u(
223
+ a,
224
+ q,
225
+ y,
226
+ s(),
227
+ oe,
228
+ be
229
+ );
630
230
  }
631
- function ar(s, d, b) {
632
- return ft(s, d, b, !0);
231
+ function g(a) {
232
+ A(a) ? a._store && (a._store.validated = 1) : typeof a == "object" && a !== null && a.$$typeof === w && (a._payload.status === "fulfilled" ? A(a._payload.value) && a._payload.value._store && (a._payload.value._store.validated = 1) : a._store && (a._store.validated = 1));
633
233
  }
634
- function or(s, d, b) {
635
- return ft(s, d, b, !1);
234
+ function A(a) {
235
+ return typeof a == "object" && a !== null && a.$$typeof === _;
636
236
  }
637
- var lr = or, ir = ar;
638
- be.Fragment = a, be.jsx = lr, be.jsxs = ir;
639
- })()), be;
237
+ var L = l, _ = /* @__PURE__ */ Symbol.for("react.transitional.element"), N = /* @__PURE__ */ Symbol.for("react.portal"), O = /* @__PURE__ */ Symbol.for("react.fragment"), R = /* @__PURE__ */ Symbol.for("react.strict_mode"), j = /* @__PURE__ */ Symbol.for("react.profiler"), I = /* @__PURE__ */ Symbol.for("react.consumer"), S = /* @__PURE__ */ Symbol.for("react.context"), b = /* @__PURE__ */ Symbol.for("react.forward_ref"), x = /* @__PURE__ */ Symbol.for("react.suspense"), f = /* @__PURE__ */ Symbol.for("react.suspense_list"), T = /* @__PURE__ */ Symbol.for("react.memo"), w = /* @__PURE__ */ Symbol.for("react.lazy"), k = /* @__PURE__ */ Symbol.for("react.activity"), P = /* @__PURE__ */ Symbol.for("react.client.reference"), p = L.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, C = Object.prototype.hasOwnProperty, M = Array.isArray, E = console.createTask ? console.createTask : function() {
238
+ return null;
239
+ };
240
+ L = {
241
+ react_stack_bottom_frame: function(a) {
242
+ return a();
243
+ }
244
+ };
245
+ var F, $ = {}, z = L.react_stack_bottom_frame.bind(
246
+ L,
247
+ o
248
+ )(), H = E(n(o)), Y = {};
249
+ ee.Fragment = O, ee.jsx = function(a, v, y) {
250
+ var D = 1e4 > p.recentlyCreatedOwnerStacks++;
251
+ return h(
252
+ a,
253
+ v,
254
+ y,
255
+ !1,
256
+ D ? Error("react-stack-top-frame") : z,
257
+ D ? E(n(a)) : H
258
+ );
259
+ }, ee.jsxs = function(a, v, y) {
260
+ var D = 1e4 > p.recentlyCreatedOwnerStacks++;
261
+ return h(
262
+ a,
263
+ v,
264
+ y,
265
+ !0,
266
+ D ? Error("react-stack-top-frame") : z,
267
+ D ? E(n(a)) : H
268
+ );
269
+ };
270
+ })()), ee;
640
271
  }
641
- var pt;
642
- function Lr() {
643
- return pt || (pt = 1, process.env.NODE_ENV === "production" ? Se.exports = Fr() : Se.exports = Dr()), Se.exports;
272
+ var Se;
273
+ function St() {
274
+ return Se || (Se = 1, process.env.NODE_ENV === "production" ? me.exports = Tt() : me.exports = It()), me.exports;
644
275
  }
645
- var t = Lr();
646
- function $r() {
647
- const [e, r] = m.useState(!1), [n, a] = m.useState(null), o = ae((j) => j.replaceAll), i = Ot(), { showAlert: h } = Tt(), l = ie(), u = l.state.isPreview, p = l.state.isCodeEditor ?? !1, v = l.state.codeEditorHasError ?? !1, x = (j) => {
276
+ var t = St();
277
+ function kt() {
278
+ const [e, i] = l.useState(!1), [r, n] = l.useState(null), s = V((j) => j.replaceAll), o = $e(), { showAlert: d } = Ue(), m = B(), c = m.state.isPreview, u = m.state.isCodeEditor ?? !1, h = m.state.codeEditorHasError ?? !1, g = (j) => {
648
279
  try {
649
- const L = String(j).replace(/^\uFEFF/, "").trim(), { data: I, schemaType: f } = Ae(L);
650
- if (f !== "mieforms" && f !== "surveyjs") {
651
- h(
280
+ const I = String(j).replace(/^\uFEFF/, "").trim(), { data: S, schemaType: b } = fe(I);
281
+ if (b !== "mieforms" && b !== "surveyjs") {
282
+ d(
652
283
  `Expected: MIE Forms or SurveyJS
653
- Detected: ${f}`,
284
+ Detected: ${b}`,
654
285
  { title: "Unsupported Schema Format" }
655
286
  );
656
287
  return;
657
288
  }
658
- a({ data: I, detectedSchemaType: f }), r(!0);
659
- } catch (L) {
660
- h(
661
- (L == null ? void 0 : L.message) || "Invalid file format",
289
+ n({ data: S, detectedSchemaType: b }), i(!0);
290
+ } catch (I) {
291
+ d(
292
+ I?.message || "Invalid file format",
662
293
  { title: "Failed to Parse File" }
663
294
  );
664
295
  }
665
- }, P = (j) => {
666
- var L, I;
667
- if (n)
296
+ }, A = (j) => {
297
+ if (r)
668
298
  try {
669
- const { data: f } = n, C = _e(f, j), g = C.fields || [];
670
- if (!Array.isArray(g))
299
+ const { data: I } = r, S = pe(I, j), b = S.fields || [];
300
+ if (!Array.isArray(b))
671
301
  throw new Error("Expected array of fields");
672
- C.conversionReport && l.setConversionReport(C.conversionReport);
673
- const D = {
674
- schemaType: j === "surveyjs" ? "mieforms-v1.0" : f.schemaType || "mieforms-v1.0",
675
- ...((L = C.conversionReport) == null ? void 0 : L.surveyMetadata) || {},
676
- fields: g
302
+ S.conversionReport && m.setConversionReport(S.conversionReport);
303
+ const x = {
304
+ schemaType: j === "surveyjs" ? "mieforms-v1.0" : I.schemaType || "mieforms-v1.0",
305
+ ...S.conversionReport?.surveyMetadata || {},
306
+ fields: b
677
307
  };
678
308
  if (j === "mieforms") {
679
- const { fields: T, schemaType: N, ...V } = f;
680
- Object.keys(V).length > 0 && Object.assign(D, V);
309
+ const { fields: f, schemaType: T, ...w } = I;
310
+ Object.keys(w).length > 0 && Object.assign(x, w);
681
311
  }
682
- if (o(D), l.selectedFieldId.clear(), l.preview.set(!1), j === "surveyjs" && C.conversionReport) {
683
- const T = C.conversionReport, N = ((I = T.unsupportedFields) == null ? void 0 : I.length) || 0;
684
- h(
312
+ if (s(x), m.selectedFieldId.clear(), m.preview.set(!1), j === "surveyjs" && S.conversionReport) {
313
+ const f = S.conversionReport, T = f.unsupportedFields?.length || 0;
314
+ d(
685
315
  `Format: SurveyJS → MIE Forms
686
316
 
687
- Converted: ${T.convertedFields || 0} field(s)
688
- Unsupported: ${N} field(s)${N > 0 ? " ⚠️" : ""}`,
317
+ Converted: ${f.convertedFields || 0} field(s)
318
+ Unsupported: ${T} field(s)${T > 0 ? " ⚠️" : ""}`,
689
319
  { title: "✅ Import Successful" }
690
320
  );
691
321
  } else
692
- h(
322
+ d(
693
323
  `Format: ${j === "surveyjs" ? "SurveyJS" : "MIE Forms"}
694
- Loaded ${g.length} field(s)`,
324
+ Loaded ${b.length} field(s)`,
695
325
  { title: "✅ Import Successful" }
696
326
  );
697
- r(!1), a(null);
698
- } catch (f) {
699
- h(
700
- (f == null ? void 0 : f.message) || "Invalid format",
327
+ i(!1), n(null);
328
+ } catch (I) {
329
+ d(
330
+ I?.message || "Invalid format",
701
331
  { title: "Import Failed" }
702
- ), r(!1), a(null);
332
+ ), i(!1), n(null);
703
333
  }
704
- }, A = () => {
705
- r(!1), a(null);
706
- }, z = () => {
707
- l.preview.set(!1), l.codeEditor.set(!1);
708
- }, E = () => {
709
- l.preview.set(!1), l.codeEditor.set(!0);
710
- }, F = () => {
711
- l.preview.set(!0), l.codeEditor.set(!1), l.selectedFieldId.clear();
334
+ }, L = () => {
335
+ i(!1), n(null);
336
+ }, _ = () => {
337
+ m.preview.set(!1), m.codeEditor.set(!1);
338
+ }, N = () => {
339
+ m.preview.set(!1), m.codeEditor.set(!0);
340
+ }, O = () => {
341
+ m.preview.set(!0), m.codeEditor.set(!1), m.selectedFieldId.clear();
712
342
  }, R = () => {
713
- const j = JSON.stringify(i, null, 2), L = new Blob([j], { type: "application/json" }), I = URL.createObjectURL(L), f = document.createElement("a");
714
- f.href = I, f.download = "questionnaire.json", f.click(), URL.revokeObjectURL(I);
343
+ const j = JSON.stringify(o, null, 2), I = new Blob([j], { type: "application/json" }), S = URL.createObjectURL(I), b = document.createElement("a");
344
+ b.href = S, b.download = "questionnaire.json", b.click(), URL.revokeObjectURL(S);
715
345
  };
716
- return /* @__PURE__ */ t.jsxs("header", { className: "editor-header w-full bg-white border border-gray-200 rounded-lg shadow-sm", children: [
717
- /* @__PURE__ */ t.jsxs("div", { className: "px-4 py-4", children: [
718
- /* @__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" }) }),
719
- /* @__PURE__ */ t.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
720
- /* @__PURE__ */ t.jsxs("div", { className: "header-mode-toggle flex gap-1 rounded-lg border border-black/10 bg-black/5 p-1 w-fit", children: [
721
- /* @__PURE__ */ t.jsxs(
722
- "button",
723
- {
724
- 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 && !p ? "bg-white text-slate-900 shadow-sm" : v ? "text-slate-400 cursor-not-allowed" : "text-slate-600 hover:text-slate-900"}`,
725
- onClick: z,
726
- disabled: v,
727
- title: v ? "Fix code errors before switching" : "Visual Editor",
728
- children: [
729
- /* @__PURE__ */ t.jsx(dr, { className: "w-5 h-5" }),
730
- /* @__PURE__ */ t.jsx("span", { children: "Build" })
731
- ]
732
- }
733
- ),
734
- /* @__PURE__ */ t.jsxs(
735
- "button",
736
- {
737
- 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 ${p ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
738
- onClick: E,
739
- title: "Code Editor",
740
- children: [
741
- /* @__PURE__ */ t.jsx(fr, { className: "w-5 h-5" }),
742
- /* @__PURE__ */ t.jsx("span", { children: "Code" })
743
- ]
744
- }
745
- ),
746
- /* @__PURE__ */ t.jsxs(
747
- "button",
346
+ return /* @__PURE__ */ t.jsxs("header", { className: "editor-header mie:w-full mie:bg-miesurface mie:border mie:border-mieborder mie:rounded-lg mie:shadow-sm", children: [
347
+ /* @__PURE__ */ t.jsx("div", { className: "mie:px-4 mie:py-4", children: /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:flex-wrap mie:items-center mie:justify-between mie:gap-3", children: [
348
+ /* @__PURE__ */ t.jsxs("div", { className: "header-mode-toggle mie:flex mie:gap-1 mie:rounded-lg mie:border mie:border-mieborder mie:bg-miebackground mie:p-1 mie:w-fit", children: [
349
+ /* @__PURE__ */ t.jsxs(
350
+ "button",
351
+ {
352
+ className: `mie:flex mie:items-center mie:justify-center mie:gap-2 mie:px-2 mie:lg:px-4 mie:py-2 mie:lg:py-2 mie:rounded-lg mie:text-xs mie:lg:text-sm mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${!c && !u ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : h ? "mie:bg-transparent mie:text-mietextmuted/50 mie:cursor-not-allowed" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
353
+ onClick: _,
354
+ disabled: h,
355
+ title: h ? "Fix code errors before switching" : "Visual Editor",
356
+ children: [
357
+ /* @__PURE__ */ t.jsx(tt, { className: "mie:w-5 mie:h-5" }),
358
+ /* @__PURE__ */ t.jsx("span", { children: "Build" })
359
+ ]
360
+ }
361
+ ),
362
+ /* @__PURE__ */ t.jsxs(
363
+ "button",
364
+ {
365
+ className: `mie:flex mie:items-center mie:justify-center mie:gap-2 mie:px-2 mie:lg:px-4 mie:py-2 mie:lg:py-2 mie:rounded-lg mie:text-xs mie:lg:text-sm mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${u ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
366
+ onClick: N,
367
+ title: "Code Editor",
368
+ children: [
369
+ /* @__PURE__ */ t.jsx(it, { className: "mie:w-5 mie:h-5" }),
370
+ /* @__PURE__ */ t.jsx("span", { children: "Code" })
371
+ ]
372
+ }
373
+ ),
374
+ /* @__PURE__ */ t.jsxs(
375
+ "button",
376
+ {
377
+ className: `mie:flex mie:items-center mie:justify-center mie:gap-2 mie:px-2 mie:lg:px-4 mie:py-2 mie:lg:py-2 mie:rounded-lg mie:text-xs mie:lg:text-sm mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${c ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : h ? "mie:bg-transparent mie:text-mietextmuted/50 mie:cursor-not-allowed" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
378
+ onClick: O,
379
+ disabled: h,
380
+ title: h ? "Fix code errors before switching" : "Preview Form",
381
+ children: [
382
+ /* @__PURE__ */ t.jsx(rt, { className: "mie:w-5 mie:h-5" }),
383
+ /* @__PURE__ */ t.jsx("span", { children: "Preview" })
384
+ ]
385
+ }
386
+ )
387
+ ] }),
388
+ /* @__PURE__ */ t.jsxs("div", { className: "header-actions mie:flex mie:gap-1 mie:items-center", children: [
389
+ /* @__PURE__ */ t.jsxs("label", { className: "header-import-label mie:group mie:px-2 mie:py-2 mie:lg:px-3 mie:lg:py-2 mie:rounded-lg mie:border mie:border-mieborder mie:bg-miesurface mie:hover:bg-mieprimary mie:hover:text-mietextsecondary mie:hover:border-mieprimary mie:cursor-pointer mie:text-xs mie:lg:text-sm mie:font-medium mie:transition-colors mie:flex mie:items-center mie:lg:gap-2 mie:gap-0 mie:text-mietext", children: [
390
+ /* @__PURE__ */ t.jsx(nt, { className: "mie:w-4 mie:h-4 mie:lg:w-4 mie:lg:h-4 mie:text-mietext mie:group-hover:text-mietextsecondary mie:transition-colors" }),
391
+ /* @__PURE__ */ t.jsx("span", { className: "mie:hidden min-[445px]:inline", children: "Import" }),
392
+ /* @__PURE__ */ t.jsx(
393
+ "input",
748
394
  {
749
- 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" : v ? "text-slate-400 cursor-not-allowed" : "text-slate-600 hover:text-slate-900"}`,
750
- onClick: F,
751
- disabled: v,
752
- title: v ? "Fix code errors before switching" : "Preview Form",
753
- children: [
754
- /* @__PURE__ */ t.jsx(mr, { className: "w-5 h-5" }),
755
- /* @__PURE__ */ t.jsx("span", { children: "Preview" })
756
- ]
757
- }
758
- )
759
- ] }),
760
- /* @__PURE__ */ t.jsxs("div", { className: "header-actions flex gap-1 items-center", children: [
761
- /* @__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: [
762
- /* @__PURE__ */ t.jsx(hr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
763
- /* @__PURE__ */ t.jsx("span", { className: "hidden min-[445px]:inline", children: "Import" }),
764
- /* @__PURE__ */ t.jsx(
765
- "input",
766
- {
767
- className: "hidden",
768
- type: "file",
769
- accept: ".json,.yaml,.yml,application/json,text/yaml",
770
- onChange: (j) => {
771
- var f;
772
- const L = (f = j.target.files) == null ? void 0 : f[0];
773
- if (!L) return;
774
- const I = new FileReader();
775
- I.onload = (C) => {
776
- var g;
777
- return x(((g = C.target) == null ? void 0 : g.result) ?? "");
778
- }, I.readAsText(L), j.target.value = "";
779
- }
395
+ className: "mie:hidden",
396
+ type: "file",
397
+ accept: ".json,.yaml,.yml,application/json,text/yaml",
398
+ onChange: (j) => {
399
+ const I = j.target.files?.[0];
400
+ if (!I) return;
401
+ const S = new FileReader();
402
+ S.onload = (b) => g(b.target?.result ?? ""), S.readAsText(I), j.target.value = "";
780
403
  }
781
- )
782
- ] }),
783
- /* @__PURE__ */ t.jsxs(
784
- "button",
785
- {
786
- 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",
787
- onClick: R,
788
- title: "Export",
789
- children: [
790
- /* @__PURE__ */ t.jsx(pr, { className: "w-4 h-4 lg:w-4 lg:h-4" }),
791
- /* @__PURE__ */ t.jsx("span", { className: "hidden min-[445px]:inline", children: "Export" })
792
- ]
793
404
  }
794
405
  )
795
- ] })
406
+ ] }),
407
+ /* @__PURE__ */ t.jsxs(
408
+ "button",
409
+ {
410
+ className: "mie:group mie:px-2 mie:py-2 mie:lg:px-3 mie:lg:py-2 mie:rounded-lg mie:border mie:border-mieborder mie:bg-miesurface mie:hover:bg-mieprimary mie:hover:text-mietextsecondary mie:hover:border-mieprimary mie:text-xs mie:lg:text-sm mie:font-medium mie:transition-colors mie:flex mie:items-center mie:lg:gap-2 mie:gap-0 mie:outline-none mie:focus:outline-none mie:text-mietext",
411
+ onClick: R,
412
+ title: "Export",
413
+ children: [
414
+ /* @__PURE__ */ t.jsx(st, { className: "mie:w-4 mie:h-4 mie:lg:w-4 mie:lg:h-4 mie:text-mietext mie:group-hover:text-mietextsecondary mie:transition-colors" }),
415
+ /* @__PURE__ */ t.jsx("span", { className: "mie:hidden min-[445px]:inline", children: "Export" })
416
+ ]
417
+ }
418
+ )
796
419
  ] })
797
- ] }),
798
- e && n && /* @__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: [
799
- /* @__PURE__ */ t.jsxs("div", { className: "import-modal-header mb-6", children: [
800
- /* @__PURE__ */ t.jsx("h3", { className: "text-xl font-semibold text-slate-900 mb-2", children: "Confirm Schema Type" }),
801
- /* @__PURE__ */ t.jsxs("p", { className: "text-sm text-slate-600", children: [
420
+ ] }) }),
421
+ e && r && /* @__PURE__ */ t.jsx("div", { className: "import-modal-overlay mie:fixed mie:inset-0 mie:z-50 mie:flex mie:items-center mie:justify-center mie:bg-mieoverlay mie:p-4", children: /* @__PURE__ */ t.jsxs("div", { className: "import-modal-content mie:bg-miesurface mie:rounded-2xl mie:shadow-2xl mie:max-w-md mie:w-full mie:p-6", children: [
422
+ /* @__PURE__ */ t.jsxs("div", { className: "import-modal-header mie:mb-6", children: [
423
+ /* @__PURE__ */ t.jsx("h3", { className: "mie:text-xl mie:font-semibold mie:text-mietext mie:mb-2", children: "Confirm Schema Type" }),
424
+ /* @__PURE__ */ t.jsxs("p", { className: "mie:text-sm mie:text-mietextmuted", children: [
802
425
  "Is this a ",
803
- /* @__PURE__ */ t.jsx("strong", { className: "text-slate-900", children: n.detectedSchemaType === "surveyjs" ? "SurveyJS" : "MIE Forms" }),
426
+ /* @__PURE__ */ t.jsx("strong", { className: "mie:text-mietext", children: r.detectedSchemaType === "surveyjs" ? "SurveyJS" : "MIE Forms" }),
804
427
  " schema?"
805
428
  ] }),
806
- n.detectedSchemaType === "surveyjs" && /* @__PURE__ */ t.jsx("p", { className: "text-xs text-slate-500 mt-2", children: "SurveyJS schemas will be converted to MIE Forms format." })
429
+ r.detectedSchemaType === "surveyjs" && /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-mietextmuted mie:mt-2", children: "SurveyJS schemas will be converted to MIE Forms format." })
807
430
  ] }),
808
- /* @__PURE__ */ t.jsxs("div", { className: "import-modal-actions flex gap-3", children: [
431
+ /* @__PURE__ */ t.jsxs("div", { className: "import-modal-actions mie:flex mie:gap-3", children: [
809
432
  /* @__PURE__ */ t.jsx(
810
433
  "button",
811
434
  {
812
- onClick: () => P(n.detectedSchemaType),
813
- 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",
435
+ onClick: () => A(r.detectedSchemaType),
436
+ className: "mie:flex-1 mie:px-6 mie:py-3 mie:rounded-xl mie:bg-mieprimary mie:text-miesurface mie:font-semibold mie:hover:bg-mieprimary/90 mie:transition-colors mie:shadow-sm mie:hover:shadow",
814
437
  children: "Yes, Import"
815
438
  }
816
439
  ),
817
440
  /* @__PURE__ */ t.jsx(
818
441
  "button",
819
442
  {
820
- onClick: A,
821
- 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",
443
+ onClick: L,
444
+ className: "mie:flex-1 mie:px-6 mie:py-3 mie:rounded-xl mie:border-2 mie:border-mieborder mie:bg-miesurface mie:hover:bg-miebackground mie:text-mietext mie:font-semibold mie:transition-colors",
822
445
  children: "Abort"
823
446
  }
824
447
  )
@@ -826,159 +449,159 @@ Loaded ${g.length} field(s)`,
826
449
  ] }) })
827
450
  ] });
828
451
  }
829
- const qr = (e) => {
452
+ const Rt = (e) => {
830
453
  switch (e) {
831
454
  case "Text Fields":
832
- return Er;
455
+ return ft;
833
456
  case "Organization":
834
- return wr;
457
+ return ut;
835
458
  case "Selection Fields":
836
- return jr;
459
+ return dt;
837
460
  case "Rating & Ranking":
838
- return yr;
461
+ return ct;
839
462
  case "Matrix Fields":
840
- return xr;
463
+ return lt;
841
464
  case "Rich Content":
842
- return vr;
465
+ return mt;
843
466
  default:
844
467
  return null;
845
468
  }
846
- }, Wr = ({ isPreview: e = !1 }) => {
469
+ }, At = ({ isPreview: e = !1 }) => {
847
470
  if (e) return null;
848
- const r = ae((p) => p.addField), n = ie(), a = ae(
849
- ke(
850
- (p) => n.selectedFieldId.value ? p.byId[n.selectedFieldId.value] : null,
851
- [n.selectedFieldId.value]
471
+ const i = V((u) => u.addField), r = B(), n = V(
472
+ de(
473
+ (u) => r.selectedFieldId.value ? u.byId[r.selectedFieldId.value] : null,
474
+ [r.selectedFieldId.value]
852
475
  )
853
- ), o = (a == null ? void 0 : a.fieldType) === "section", i = (a == null ? void 0 : a.title) || "Section", h = m.useCallback(() => {
854
- n.selectedFieldId.set(null);
855
- }, [n.selectedFieldId]);
856
- m.useEffect(() => {
857
- const p = (v) => {
858
- v.key === "Escape" && (v.preventDefault(), v.stopPropagation(), h());
476
+ ), s = n?.fieldType === "section", o = n?.title || "Section", d = l.useCallback(() => {
477
+ r.selectedFieldId.set(null);
478
+ }, [r.selectedFieldId]);
479
+ l.useEffect(() => {
480
+ const u = (h) => {
481
+ h.key === "Escape" && (h.preventDefault(), h.stopPropagation(), d());
859
482
  };
860
- return window.addEventListener("keydown", p), () => window.removeEventListener("keydown", p);
861
- }, [h]);
862
- const l = Be(() => {
863
- const p = {};
864
- return Object.entries(de).filter(([v]) => v !== "unsupported").forEach(([v, x]) => {
865
- const P = x.category || "Other";
866
- p[P] || (p[P] = []), p[P].push({
867
- type: v,
868
- label: x.label
483
+ return window.addEventListener("keydown", u), () => window.removeEventListener("keydown", u);
484
+ }, [d]);
485
+ const m = Ee(() => {
486
+ const u = {};
487
+ return Object.entries(K).filter(([h]) => h !== "unsupported").forEach(([h, g]) => {
488
+ const A = g.category || "Other";
489
+ u[A] || (u[A] = []), u[A].push({
490
+ type: h,
491
+ label: g.label
869
492
  });
870
- }), p;
871
- }, []), u = Be(() => {
872
- const p = {};
873
- return Object.values(l).forEach((v) => {
874
- v.forEach(({ type: x }) => {
875
- p[x] = () => {
876
- o && (a != null && a.id) ? r(x, { sectionId: a.id }) : r(x);
493
+ }), u;
494
+ }, []), c = Ee(() => {
495
+ const u = {};
496
+ return Object.values(m).forEach((h) => {
497
+ h.forEach(({ type: g }) => {
498
+ u[g] = () => {
499
+ s && n?.id ? i(g, { sectionId: n.id }) : i(g);
877
500
  };
878
501
  });
879
- }), p;
880
- }, [l, r, o, a == null ? void 0 : a.id]);
502
+ }), u;
503
+ }, [m, i, s, n?.id]);
881
504
  return /* @__PURE__ */ t.jsx(
882
505
  "div",
883
506
  {
884
- 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)]",
507
+ className: " mie:border mie:border-mieborder mie:rounded-lg mie:bg-miesurface mie:overflow-y-auto mie:custom-scrollbar mie:max-h-[calc(100svh-24rem)] mie:lg:max-h-[calc(100dvh-20rem)]",
885
508
  tabIndex: "-1",
886
- children: /* @__PURE__ */ t.jsxs("div", { className: "tool-panel-container pb-4 rounded-lg shadow-sm", children: [
887
- /* @__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: [
888
- /* @__PURE__ */ t.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
889
- /* @__PURE__ */ t.jsx(gr, { className: "w-5 h-5 text-gray-700 shrink-0" }),
890
- /* @__PURE__ */ t.jsx("span", { className: "truncate", children: o ? `Add to "${i}"` : "Tools" })
509
+ children: /* @__PURE__ */ t.jsxs("div", { className: "tool-panel-container mie:pb-4 mie:rounded-lg mie:shadow-sm", children: [
510
+ /* @__PURE__ */ t.jsxs("h3", { className: "tool-panel-title mie:sticky mie:top-0 mie:z-20 mie:bg-miesurface mie:text-base mie:font-semibold mie:text-mietext mie:pb-2 mie:pt-3 mie:px-4 mie:border-b mie:border-mieborder mie:flex mie:items-center mie:justify-between mie:gap-2", children: [
511
+ /* @__PURE__ */ t.jsxs("span", { className: "mie:flex mie:items-center mie:gap-2 mie:min-w-0", children: [
512
+ /* @__PURE__ */ t.jsx(ot, { className: "mie:w-5 mie:h-5 mie:text-mietext mie:shrink-0" }),
513
+ /* @__PURE__ */ t.jsx("span", { className: "mie:truncate mie:text-mietext", children: s ? `Add to "${o}"` : "Tools" })
891
514
  ] }),
892
- o && /* @__PURE__ */ t.jsx(
515
+ s && /* @__PURE__ */ t.jsx(
893
516
  "button",
894
517
  {
895
- onClick: h,
896
- className: "text-gray-600 hover:text-red-600 hover:bg-red-50 p-1 rounded transition-colors shrink-0",
518
+ onClick: d,
519
+ className: "mie:bg-transparent mie:text-mietextmuted mie:hover:text-miedanger mie:hover:bg-miedanger/10 mie:p-1 mie:rounded mie:transition-colors mie:shrink-0",
897
520
  title: "Unselect section",
898
- children: /* @__PURE__ */ t.jsx(br, { className: "w-5 h-5" })
521
+ children: /* @__PURE__ */ t.jsx(at, { className: "mie:w-5 mie:h-5" })
899
522
  }
900
523
  )
901
524
  ] }),
902
- Object.entries(l).map(([p, v]) => /* @__PURE__ */ t.jsxs("div", { className: "tool-category", children: [
903
- /* @__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: [
525
+ Object.entries(m).map(([u, h]) => /* @__PURE__ */ t.jsxs("div", { className: "tool-category", children: [
526
+ /* @__PURE__ */ t.jsxs("h4", { className: "mie:sticky mie:top-11 mie:z-10 mie:bg-miebackground mie:text-sm mie:font-semibold mie:text-mietext mie:px-4 mie:py-3 mie:border-b mie:border-mieborder mie:uppercase mie:tracking-wide mie:flex mie:items-center mie:gap-2", children: [
904
527
  (() => {
905
- const x = qr(p);
906
- return x ? /* @__PURE__ */ t.jsx(x, { className: "w-4 h-4 text-gray-600" }) : null;
528
+ const g = Rt(u);
529
+ return g ? /* @__PURE__ */ t.jsx(g, { className: "mie:w-4 mie:h-4 mie:text-mietextmuted" }) : null;
907
530
  })(),
908
- p
531
+ u
909
532
  ] }),
910
- /* @__PURE__ */ t.jsx("div", { className: "tool-items grid grid-cols-1 gap-2 px-4 py-3", children: v.map(({ type: x, label: P }) => {
911
- const A = o && x === "section";
533
+ /* @__PURE__ */ t.jsx("div", { className: "tool-items mie:grid mie:grid-cols-1 mie:gap-2 mie:px-4 mie:py-3", children: h.map(({ type: g, label: A }) => {
534
+ const L = s && g === "section";
912
535
  return /* @__PURE__ */ t.jsxs(
913
536
  "button",
914
537
  {
915
- disabled: A,
916
- className: `px-3 py-2 text-sm text-left border rounded-md transition-colors duration-150 ${A ? "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"}`,
917
- onClick: u[x],
918
- title: A ? "Cannot add section to a section" : `Add ${P}`,
538
+ disabled: L,
539
+ className: `mie:px-3 mie:py-2 mie:text-sm mie:text-left mie:border mie:rounded-md mie:transition-colors mie:duration-150 ${L ? "mie:border-mieborder mie:bg-miebackground mie:text-mietextmuted/50 mie:cursor-not-allowed" : "mie:bg-miesurface mie:text-mietext mie:border-mieborder mie:hover:bg-mieprimary/10 mie:hover:border-mieprimary/50 mie:hover:text-mieprimary"}`,
540
+ onClick: c[g],
541
+ title: L ? "Cannot add section to a section" : `Add ${A}`,
919
542
  children: [
920
543
  "+ ",
921
- P
544
+ A
922
545
  ]
923
546
  },
924
- x
547
+ g
925
548
  );
926
549
  }) })
927
- ] }, p))
550
+ ] }, u))
928
551
  ] })
929
552
  }
930
553
  );
931
- }, gt = m.memo(Wr, (e, r) => e.isPreview === r.isPreview);
932
- function St({
554
+ }, ke = l.memo(At, (e, i) => e.isPreview === i.isPreview);
555
+ function ze({
933
556
  id: e = "",
934
- label: r = "ID",
935
- onCommit: n,
936
- validate: a,
937
- placeholder: o = "Enter unique ID…",
938
- className: i = ""
557
+ label: i = "ID",
558
+ onCommit: r,
559
+ validate: n,
560
+ placeholder: s = "Enter unique ID…",
561
+ className: o = ""
939
562
  }) {
940
- const [h, l] = m.useState(e ?? ""), [u, p] = m.useState("");
941
- m.useEffect(() => {
942
- l(e ?? ""), p("");
563
+ const [d, m] = l.useState(e ?? ""), [c, u] = l.useState("");
564
+ l.useEffect(() => {
565
+ m(e ?? ""), u("");
943
566
  }, [e]);
944
- const v = m.useCallback(() => {
945
- const x = String(h ?? "").trim();
946
- if (!x) {
947
- p("ID cannot be empty."), l(e ?? "");
567
+ const h = l.useCallback(() => {
568
+ const g = String(d ?? "").trim();
569
+ if (!g) {
570
+ u("ID cannot be empty."), m(e ?? "");
948
571
  return;
949
572
  }
950
- if (x !== (e ?? "")) {
951
- if (typeof a == "function") {
952
- const P = a(x, e ?? "");
953
- if (P) {
954
- p(P);
573
+ if (g !== (e ?? "")) {
574
+ if (typeof n == "function") {
575
+ const A = n(g, e ?? "");
576
+ if (A) {
577
+ u(A);
955
578
  return;
956
579
  }
957
580
  }
958
- n == null || n(x);
581
+ r?.(g);
959
582
  }
960
- }, [h, e, n, a]);
961
- return /* @__PURE__ */ t.jsxs("div", { className: i ? `draft-id-editor-container ${i}` : "draft-id-editor-container", children: [
962
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: r }),
583
+ }, [d, e, r, n]);
584
+ return /* @__PURE__ */ t.jsxs("div", { className: o ? `draft-id-editor-container ${o}` : "draft-id-editor-container", children: [
585
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: i }),
963
586
  /* @__PURE__ */ t.jsx(
964
587
  "input",
965
588
  {
966
- className: "w-full px-3 py-2 border border-black/20 rounded",
967
- value: h,
968
- onChange: (x) => {
969
- u && p(""), l(x.target.value);
589
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:transition-colors",
590
+ value: d,
591
+ onChange: (g) => {
592
+ c && u(""), m(g.target.value);
970
593
  },
971
- onBlur: v,
972
- onKeyDown: (x) => {
973
- x.key === "Enter" && (x.preventDefault(), v());
594
+ onBlur: h,
595
+ onKeyDown: (g) => {
596
+ g.key === "Enter" && (g.preventDefault(), h());
974
597
  },
975
- placeholder: o
598
+ placeholder: s
976
599
  }
977
600
  ),
978
- u ? /* @__PURE__ */ t.jsx("p", { className: "text-xs text-red-600 mt-1", children: u }) : null
601
+ c ? /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-miedanger mie:mt-1", children: c }) : null
979
602
  ] });
980
603
  }
981
- const Vr = [
604
+ const Pt = [
982
605
  { value: "text", label: "Text" },
983
606
  { value: "number", label: "Number" },
984
607
  { value: "email", label: "Email" },
@@ -988,7 +611,7 @@ const Vr = [
988
611
  { value: "month", label: "Month" },
989
612
  { value: "time", label: "Time" },
990
613
  { value: "range", label: "Range" }
991
- ], Ur = {
614
+ ], Mt = {
992
615
  Length: [
993
616
  { value: "mm", label: "Millimeters (mm)" },
994
617
  { value: "cm", label: "Centimeters (cm)" },
@@ -1026,402 +649,392 @@ const Vr = [
1026
649
  { value: "mmHg", label: "mmHg (blood pressure)" }
1027
650
  ]
1028
651
  };
1029
- function zr({ field: e, onUpdate: r }) {
1030
- const n = e.inputType || "text", a = e.unit || "", o = n === "number" || n === "range";
1031
- return /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
652
+ function Ft({ field: e, onUpdate: i }) {
653
+ const r = e.inputType || "text", n = e.unit || "", s = r === "number" || r === "range";
654
+ return /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
1032
655
  /* @__PURE__ */ t.jsxs("div", { children: [
1033
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: "Input Type" }),
656
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Input Type" }),
1034
657
  /* @__PURE__ */ t.jsx(
1035
658
  "select",
1036
659
  {
1037
- className: "w-full px-3 py-2 border border-black/20 rounded",
1038
- value: n,
1039
- onChange: (i) => r("inputType", i.target.value),
1040
- children: Vr.map((i) => /* @__PURE__ */ t.jsx("option", { value: i.value, children: i.label }, i.value))
660
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:cursor-pointer mie:transition-colors",
661
+ value: r,
662
+ onChange: (o) => i("inputType", o.target.value),
663
+ children: Pt.map((o) => /* @__PURE__ */ t.jsx("option", { value: o.value, children: o.label }, o.value))
1041
664
  }
1042
665
  )
1043
666
  ] }),
1044
- o && /* @__PURE__ */ t.jsxs("div", { children: [
1045
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: "Unit (optional)" }),
667
+ s && /* @__PURE__ */ t.jsxs("div", { children: [
668
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Unit (optional)" }),
1046
669
  /* @__PURE__ */ t.jsxs(
1047
670
  "select",
1048
671
  {
1049
- className: "w-full px-3 py-2 border border-black/20 rounded",
1050
- value: a,
1051
- onChange: (i) => r("unit", i.target.value),
672
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:cursor-pointer mie:transition-colors",
673
+ value: n,
674
+ onChange: (o) => i("unit", o.target.value),
1052
675
  children: [
1053
676
  /* @__PURE__ */ t.jsx("option", { value: "", children: "None" }),
1054
- Object.entries(Ur).map(([i, h]) => /* @__PURE__ */ t.jsx("optgroup", { label: i, children: h.map((l) => /* @__PURE__ */ t.jsx("option", { value: l.value, children: l.label }, l.value)) }, i))
677
+ Object.entries(Mt).map(([o, d]) => /* @__PURE__ */ t.jsx("optgroup", { label: o, children: d.map((m) => /* @__PURE__ */ t.jsx("option", { value: m.value, children: m.label }, m.value)) }, o))
1055
678
  ]
1056
679
  }
1057
680
  )
1058
681
  ] })
1059
682
  ] });
1060
683
  }
1061
- function It({ f: e, onUpdateField: r }) {
1062
- const n = ae(m.useCallback((o) => o.byId, [])), a = m.useCallback((o, i) => {
1063
- if (!(o != null && o.trim())) return "ID cannot be empty.";
1064
- if (o === i) return "";
1065
- const h = new Set(Object.keys(n));
1066
- return Object.values(n).forEach((l) => {
1067
- (l == null ? void 0 : l.fieldType) === "section" && Array.isArray(l.fields) && l.fields.forEach((u) => h.add(u.id));
1068
- }), h.has(o) ? `ID "${o}" already exists.` : "";
1069
- }, [n]);
1070
- return /* @__PURE__ */ t.jsxs("div", { className: "common-editor-container space-y-3", children: [
684
+ function We({ f: e, onUpdateField: i }) {
685
+ const r = V(l.useCallback((s) => s.byId, [])), n = l.useCallback((s, o) => {
686
+ if (!s?.trim()) return "ID cannot be empty.";
687
+ if (s === o) return "";
688
+ const d = new Set(Object.keys(r));
689
+ return Object.values(r).forEach((m) => {
690
+ m?.fieldType === "section" && Array.isArray(m.fields) && m.fields.forEach((c) => d.add(c.id));
691
+ }), d.has(s) ? `ID "${s}" already exists.` : "";
692
+ }, [r]);
693
+ return /* @__PURE__ */ t.jsxs("div", { className: "common-editor-container mie:space-y-3", children: [
1071
694
  /* @__PURE__ */ t.jsx(
1072
- St,
695
+ ze,
1073
696
  {
1074
697
  id: e.id ?? "",
1075
- validate: a,
1076
- onCommit: (o) => r == null ? void 0 : r("id", o)
698
+ validate: n,
699
+ onCommit: (s) => i?.("id", s)
1077
700
  }
1078
701
  ),
1079
702
  /* @__PURE__ */ t.jsxs("div", { children: [
1080
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: "Label / Question" }),
703
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Label / Question" }),
1081
704
  /* @__PURE__ */ t.jsx(
1082
705
  "input",
1083
706
  {
1084
- className: "w-full px-3 py-2 border border-black/20 rounded",
707
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:transition-colors",
1085
708
  value: e.question || "",
1086
- onChange: (o) => r == null ? void 0 : r("question", o.target.value),
709
+ onChange: (s) => i?.("question", s.target.value),
1087
710
  placeholder: "Enter question text"
1088
711
  }
1089
712
  )
1090
713
  ] }),
1091
- (e.fieldType === "text" || e.fieldType === "longtext") && /* @__PURE__ */ t.jsx(zr, { field: e, onUpdate: r }),
1092
- /* @__PURE__ */ t.jsxs("div", { children: [
1093
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm mb-1", children: "Sublabel (optional)" }),
714
+ (e.fieldType === "text" || e.fieldType === "longtext") && /* @__PURE__ */ t.jsx(Ft, { field: e, onUpdate: i }),
715
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:min-w-0", children: [
716
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Sublabel (optional)" }),
1094
717
  /* @__PURE__ */ t.jsx(
1095
718
  "textarea",
1096
719
  {
1097
- className: "w-full px-3 py-2 border border-black/20 rounded",
720
+ className: "mie:w-full mie:min-w-0 mie:max-h-32 mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:resize-y mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:transition-colors",
1098
721
  value: e.sublabel || "",
1099
- onChange: (o) => r("sublabel", o.target.value),
722
+ onChange: (s) => i("sublabel", s.target.value),
1100
723
  placeholder: "Helper text / description"
1101
724
  }
1102
725
  )
1103
726
  ] }),
1104
- /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsxs("label", { className: "inline-flex items-center gap-2 text-sm", children: [
727
+ /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsxs("label", { className: "mie:inline-flex mie:items-center mie:gap-2 mie:text-sm mie:text-mietext mie:cursor-pointer", children: [
1105
728
  /* @__PURE__ */ t.jsx(
1106
- "input",
729
+ pt,
1107
730
  {
1108
- type: "checkbox",
1109
731
  checked: !!e.required,
1110
- onChange: (o) => r == null ? void 0 : r("required", o.target.checked)
732
+ onChange: (s) => i?.("required", s),
733
+ size: "md"
1111
734
  }
1112
735
  ),
1113
736
  "Required"
1114
737
  ] }) })
1115
738
  ] });
1116
739
  }
1117
- function Rt({ field: e, api: r }) {
1118
- const n = e.options || [], a = e.fieldType === "boolean", o = e.fieldType === "multitext", i = m.useRef(null), h = m.useRef(n.length), l = o ? "Text Inputs" : "Options", u = o ? "Text Input" : "Option", p = o ? "Input label" : "Option text";
1119
- return m.useEffect(() => {
1120
- if (n.length > h.current && i.current) {
1121
- const v = i.current.lastElementChild;
1122
- v && v.scrollIntoView({ behavior: "smooth", block: "nearest" });
1123
- }
1124
- h.current = n.length;
1125
- }, [n.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1126
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: l }),
1127
- /* @__PURE__ */ t.jsx("div", { ref: i, className: "space-y-2", children: n.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: [
740
+ function Ve({ field: e, api: i }) {
741
+ const r = e.options || [], n = e.fieldType === "boolean", s = e.fieldType === "multitext", o = l.useRef(null), d = l.useRef(r.length), m = s ? "Text Inputs" : "Options", c = s ? "Text Input" : "Option", u = s ? "Input label" : "Option text";
742
+ return l.useEffect(() => {
743
+ if (r.length > d.current && o.current) {
744
+ const h = o.current.lastElementChild;
745
+ h && h.scrollIntoView({ behavior: "smooth", block: "nearest" });
746
+ }
747
+ d.current = r.length;
748
+ }, [r.length]), /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
749
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: m }),
750
+ /* @__PURE__ */ t.jsx("div", { ref: o, className: "mie:space-y-2", children: r.map((h) => /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:gap-2 mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:shadow-sm mie:hover:border-mieprimary/50 mie:transition-colors", children: [
1128
751
  /* @__PURE__ */ t.jsx(
1129
752
  "input",
1130
753
  {
1131
- className: "flex-1 min-w-0 outline-none bg-transparent",
1132
- value: v.value,
1133
- onChange: (x) => r.option.update(v.id, x.target.value),
1134
- placeholder: p
754
+ className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent",
755
+ value: h.value,
756
+ onChange: (g) => i.option.update(h.id, g.target.value),
757
+ placeholder: u
1135
758
  }
1136
759
  ),
1137
- !a && /* @__PURE__ */ t.jsx(
760
+ !n && /* @__PURE__ */ t.jsx(
1138
761
  "button",
1139
762
  {
1140
- onClick: () => r.option.remove(v.id),
1141
- className: "flex-shrink-0 text-gray-400 hover:text-red-600 transition-colors",
763
+ onClick: () => i.option.remove(h.id),
764
+ className: "mie:shrink-0 mie:bg-transparent mie:text-mietextmuted/70 mie:hover:text-miedanger mie:transition-colors",
1142
765
  title: "Remove option",
1143
- children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
766
+ children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
1144
767
  }
1145
768
  )
1146
- ] }, v.id)) }),
1147
- !a && /* @__PURE__ */ t.jsxs(
769
+ ] }, h.id)) }),
770
+ !n && /* @__PURE__ */ t.jsxs(
1148
771
  "button",
1149
772
  {
1150
- onClick: () => r.option.add(""),
1151
- 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",
773
+ onClick: () => i.option.add(""),
774
+ className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-miesurface mie:text-mieprimary mie:border mie:border-mieprimary/50 mie:rounded-lg mie:hover:bg-mieprimary/10 mie:transition-colors",
1152
775
  children: [
1153
776
  "+ Add ",
1154
- u
777
+ c
1155
778
  ]
1156
779
  }
1157
780
  )
1158
781
  ] });
1159
782
  }
1160
- function kt({ field: e, api: r }) {
1161
- const n = e.rows || [], a = e.columns || [], o = m.useRef(null), i = m.useRef(null), h = m.useRef(n.length), l = m.useRef(a.length);
1162
- return m.useEffect(() => {
1163
- if (n.length > h.current && o.current) {
1164
- const u = o.current.lastElementChild;
1165
- u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
1166
- }
1167
- h.current = n.length;
1168
- }, [n.length]), m.useEffect(() => {
1169
- if (a.length > l.current && i.current) {
1170
- const u = i.current.lastElementChild;
1171
- u && u.scrollIntoView({ behavior: "smooth", block: "nearest" });
1172
- }
1173
- l.current = a.length;
1174
- }, [a.length]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-4", children: [
1175
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1176
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Rows" }),
1177
- /* @__PURE__ */ t.jsx("div", { ref: o, className: "space-y-2", children: n.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: [
783
+ function He({ field: e, api: i }) {
784
+ const r = e.rows || [], n = e.columns || [], s = l.useRef(null), o = l.useRef(null), d = l.useRef(r.length), m = l.useRef(n.length);
785
+ return l.useEffect(() => {
786
+ if (r.length > d.current && s.current) {
787
+ const c = s.current.lastElementChild;
788
+ c && c.scrollIntoView({ behavior: "smooth", block: "nearest" });
789
+ }
790
+ d.current = r.length;
791
+ }, [r.length]), l.useEffect(() => {
792
+ if (n.length > m.current && o.current) {
793
+ const c = o.current.lastElementChild;
794
+ c && c.scrollIntoView({ behavior: "smooth", block: "nearest" });
795
+ }
796
+ m.current = n.length;
797
+ }, [n.length]), /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-4", children: [
798
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
799
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: "Rows" }),
800
+ /* @__PURE__ */ t.jsx("div", { ref: s, className: "mie:space-y-2", children: r.map((c) => /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:gap-2 mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:shadow-sm mie:hover:border-mieprimary/50 mie:transition-colors", children: [
1178
801
  /* @__PURE__ */ t.jsx(
1179
802
  "input",
1180
803
  {
1181
- className: "flex-1 min-w-0 outline-none bg-transparent",
1182
- value: u.value,
1183
- onChange: (p) => r.row.update(u.id, p.target.value),
804
+ className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent mie:text-mietext mie:placeholder:text-mietextmuted",
805
+ value: c.value,
806
+ onChange: (u) => i.row.update(c.id, u.target.value),
1184
807
  placeholder: "Row text"
1185
808
  }
1186
809
  ),
1187
810
  /* @__PURE__ */ t.jsx(
1188
811
  "button",
1189
812
  {
1190
- onClick: () => r.row.remove(u.id),
1191
- className: "shrink-0 text-gray-400 hover:text-red-600 transition-colors",
813
+ onClick: () => i.row.remove(c.id),
814
+ className: "mie:shrink-0 mie:bg-transparent mie:text-mietextmuted/70 mie:hover:text-miedanger mie:transition-colors",
1192
815
  title: "Remove row",
1193
- children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
816
+ children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
1194
817
  }
1195
818
  )
1196
- ] }, u.id)) }),
1197
- n.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(
819
+ ] }, c.id)) }),
820
+ r.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "mie:px-3 mie:py-2 mie:text-sm mie:text-mietextmuted mie:text-center mie:bg-miebackground mie:rounded-lg", children: "Max rows reached (10)" }) : /* @__PURE__ */ t.jsx(
1198
821
  "button",
1199
822
  {
1200
- onClick: () => r.row.add(""),
1201
- 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",
823
+ onClick: () => i.row.add(""),
824
+ className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-miesurface mie:text-mieprimary mie:border mie:border-mieprimary/50 mie:rounded-lg mie:hover:bg-mieprimary/10 mie:transition-colors",
1202
825
  children: "+ Add Row"
1203
826
  }
1204
827
  )
1205
828
  ] }),
1206
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1207
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Columns" }),
1208
- /* @__PURE__ */ t.jsx("div", { ref: i, className: "space-y-2", children: a.map((u) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg shadow-sm hover:border-gray-400 transition-colors", children: [
829
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
830
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: "Columns" }),
831
+ /* @__PURE__ */ t.jsx("div", { ref: o, className: "mie:space-y-2", children: n.map((c) => /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:gap-2 mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:shadow-sm mie:hover:border-mieprimary/50 mie:transition-colors", children: [
1209
832
  /* @__PURE__ */ t.jsx(
1210
833
  "input",
1211
834
  {
1212
- className: "flex-1 min-w-0 outline-none bg-transparent",
1213
- value: u.value,
1214
- onChange: (p) => r.column.update(u.id, p.target.value),
835
+ className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent mie:text-mietext mie:placeholder:text-mietextmuted",
836
+ value: c.value,
837
+ onChange: (u) => i.column.update(c.id, u.target.value),
1215
838
  placeholder: "Column text"
1216
839
  }
1217
840
  ),
1218
841
  /* @__PURE__ */ t.jsx(
1219
842
  "button",
1220
843
  {
1221
- onClick: () => r.column.remove(u.id),
1222
- className: "shrink-0 text-gray-400 hover:text-red-600 transition-colors",
844
+ onClick: () => i.column.remove(c.id),
845
+ className: "mie:shrink-0 mie:bg-transparent mie:text-mietextmuted/70 mie:hover:text-miedanger mie:transition-colors",
1223
846
  title: "Remove column",
1224
- children: /* @__PURE__ */ t.jsx(ye, { className: "w-5 h-5" })
847
+ children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
1225
848
  }
1226
849
  )
1227
- ] }, u.id)) }),
1228
- a.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "px-3 py-2 text-sm text-gray-500 text-center bg-gray-50 rounded-lg", children: "Max columns reached (10)" }) : /* @__PURE__ */ t.jsx(
850
+ ] }, c.id)) }),
851
+ n.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "mie:px-3 mie:py-2 mie:text-sm mie:text-mietextmuted mie:text-center mie:bg-miebackground mie:rounded-lg", children: "Max columns reached (10)" }) : /* @__PURE__ */ t.jsx(
1229
852
  "button",
1230
853
  {
1231
- onClick: () => r.column.add(""),
1232
- 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",
854
+ onClick: () => i.column.add(""),
855
+ className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-miesurface mie:text-mieprimary mie:border mie:border-mieprimary/50 mie:rounded-lg mie:hover:bg-mieprimary/10 mie:transition-colors",
1233
856
  children: "+ Add Column"
1234
857
  }
1235
858
  )
1236
859
  ] })
1237
860
  ] });
1238
861
  }
1239
- function Hr({ f: e }) {
1240
- const r = Ke(e.id), n = m.useCallback(
1241
- (h, l) => r.field.update(h, l),
1242
- [r]
1243
- ), a = de[e.fieldType] || {}, o = a.hasOptions || !1, i = a.hasMatrix || !1;
862
+ function _t({ f: e }) {
863
+ const i = Ne(e.id), r = l.useCallback(
864
+ (d, m) => i.field.update(d, m),
865
+ [i]
866
+ ), n = K[e.fieldType] || {}, s = n.hasOptions || !1, o = n.hasMatrix || !1;
1244
867
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1245
- /* @__PURE__ */ t.jsx(It, { f: e, onUpdateField: n }),
1246
- e.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "non-section-editor-default-answer mt-4", children: [
1247
- /* @__PURE__ */ t.jsx("div", { className: "text-sm font-medium mb-1", children: "Default Answer" }),
868
+ /* @__PURE__ */ t.jsx(We, { f: e, onUpdateField: r }),
869
+ e.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "non-section-editor-default-answer mie:mt-4", children: [
870
+ /* @__PURE__ */ t.jsx("div", { className: "mie:text-sm mie:font-medium mie:mb-1", children: "Default Answer" }),
1248
871
  /* @__PURE__ */ t.jsx(
1249
872
  "input",
1250
873
  {
1251
- className: "w-full px-3 py-2 border border-black/20 rounded",
874
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary mie:outline-none mie:transition-colors",
1252
875
  value: e.answer || "",
1253
- onChange: (h) => n("answer", h.target.value),
876
+ onChange: (d) => r("answer", d.target.value),
1254
877
  placeholder: "Default value"
1255
878
  }
1256
879
  )
1257
880
  ] }),
1258
- o && /* @__PURE__ */ t.jsx(Rt, { field: e, api: r }),
1259
- i && /* @__PURE__ */ t.jsx(kt, { field: e, api: r })
881
+ s && /* @__PURE__ */ t.jsx(Ve, { field: e, api: i }),
882
+ o && /* @__PURE__ */ t.jsx(He, { field: e, api: i })
1260
883
  ] });
1261
884
  }
1262
- function Yr({ section: e, onActiveChildChange: r }) {
1263
- var C;
1264
- const n = Ke(e.id), a = m.useContext(Xe), o = ie();
1265
- if (!a) throw new Error("Missing FormStoreContext.Provider in the tree");
1266
- const i = Array.isArray(e.fields) ? e.fields : [], h = o.selectedChildId.ParentId, l = o.selectedChildId.ChildId, u = m.useMemo(() => {
1267
- var g;
1268
- return h === e.id && l && i.some((D) => D.id === l) ? l : ((g = i[0]) == null ? void 0 : g.id) || null;
1269
- }, []), [p, v] = m.useState(u), x = m.useRef(l);
1270
- m.useEffect(() => {
1271
- x.current !== l && (x.current = l, h === e.id && l && l !== p && v(l));
1272
- }, [h, l, e.id, p]), m.useEffect(() => {
1273
- if (!i.length) {
1274
- p !== null && v(null);
885
+ function Dt({ section: e, onActiveChildChange: i }) {
886
+ const r = Ne(e.id), n = l.useContext(Oe), s = B();
887
+ if (!n) throw new Error("Missing FormStoreContext.Provider in the tree");
888
+ const o = Array.isArray(e.fields) ? e.fields : [], d = s.selectedChildId.ParentId, m = s.selectedChildId.ChildId, c = l.useMemo(() => d === e.id && m && o.some((x) => x.id === m) ? m : o[0]?.id || null, []), [u, h] = l.useState(c), g = l.useRef(m);
889
+ l.useEffect(() => {
890
+ g.current !== m && (g.current = m, d === e.id && m && m !== u && h(m));
891
+ }, [d, m, e.id, u]), l.useEffect(() => {
892
+ if (!o.length) {
893
+ u !== null && h(null);
1275
894
  return;
1276
895
  }
1277
- i.some((D) => D.id === p) || v(i[0].id);
1278
- }, [i, p]), m.useEffect(() => {
1279
- r == null || r(e.id, p || null);
1280
- }, [e.id, p, r]);
1281
- const P = m.useCallback(
1282
- (g) => {
1283
- v(g), o.selectedChildId.set(e.id, g);
896
+ o.some((f) => f.id === u) || h(o[0].id);
897
+ }, [o, u]), l.useEffect(() => {
898
+ i?.(e.id, u || null);
899
+ }, [e.id, u, i]);
900
+ const A = l.useCallback(
901
+ (x) => {
902
+ h(x), s.selectedChildId.set(e.id, x);
1284
903
  },
1285
- [e.id, o.selectedChildId]
1286
- ), A = m.useCallback((g) => {
1287
- var D, T;
1288
- return ((D = g.question) == null ? void 0 : D.trim()) || ((T = de[g.fieldType]) == null ? void 0 : T.label) || "Untitled";
1289
- }, []), z = m.useCallback(
1290
- (g, D) => n.field.update(g, D),
1291
- [n]
1292
- ), E = m.useMemo(
1293
- () => i.find((g) => g.id === p) || null,
1294
- [i, p]
1295
- ), F = Ke((E == null ? void 0 : E.id) || "", e.id), R = E && F ? F : null, j = m.useCallback(
1296
- (g, D) => {
1297
- if (E) {
1298
- if (g === "id") {
1299
- const T = String(D ?? "").trim();
904
+ [e.id, s.selectedChildId]
905
+ ), L = l.useCallback((x) => x.question?.trim() || K[x.fieldType]?.label || "Untitled", []), _ = l.useCallback(
906
+ (x, f) => r.field.update(x, f),
907
+ [r]
908
+ ), N = l.useMemo(
909
+ () => o.find((x) => x.id === u) || null,
910
+ [o, u]
911
+ ), O = Ne(N?.id || "", e.id), R = N && O ? O : null, j = l.useCallback(
912
+ (x, f) => {
913
+ if (N) {
914
+ if (x === "id") {
915
+ const T = String(f ?? "").trim();
1300
916
  if (!T) return;
1301
- a.getState().updateField(
1302
- E.id,
917
+ n.getState().updateField(
918
+ N.id,
1303
919
  { id: T },
1304
920
  {
1305
921
  sectionId: e.id,
1306
- onIdChange: (N, V) => {
1307
- v((H) => H === V ? N : H);
922
+ onIdChange: (w, k) => {
923
+ h((P) => P === k ? w : P);
1308
924
  }
1309
925
  }
1310
926
  );
1311
927
  return;
1312
928
  }
1313
- a.getState().updateField(
1314
- E.id,
1315
- { [g]: D },
929
+ n.getState().updateField(
930
+ N.id,
931
+ { [x]: f },
1316
932
  { sectionId: e.id }
1317
933
  );
1318
934
  }
1319
935
  },
1320
- [E, e.id, a]
1321
- ), L = m.useCallback(() => {
1322
- E && a.getState().deleteField(E.id, { sectionId: e.id });
1323
- }, [E, e.id, a]), I = m.useMemo(
1324
- () => E && (de[E.fieldType] || {}).hasOptions || !1,
1325
- [E]
1326
- ), f = m.useMemo(
1327
- () => E && (de[E.fieldType] || {}).hasMatrix || !1,
1328
- [E]
936
+ [N, e.id, n]
937
+ ), I = l.useCallback(() => {
938
+ N && n.getState().deleteField(N.id, { sectionId: e.id });
939
+ }, [N, e.id, n]), S = l.useMemo(
940
+ () => N && (K[N.fieldType] || {}).hasOptions || !1,
941
+ [N]
942
+ ), b = l.useMemo(
943
+ () => N && (K[N.fieldType] || {}).hasMatrix || !1,
944
+ [N]
1329
945
  );
1330
- return /* @__PURE__ */ t.jsxs("div", { className: "space-y-4", children: [
1331
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1332
- /* @__PURE__ */ t.jsx("h3", { className: "text-sm font-semibold text-gray-700 uppercase tracking-wide", children: "Section Properties" }),
946
+ return /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-4", children: [
947
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
948
+ /* @__PURE__ */ t.jsx("h3", { className: "mie:text-sm mie:font-semibold mie:text-mietext mie:uppercase mie:tracking-wide", children: "Section Properties" }),
1333
949
  /* @__PURE__ */ t.jsx(
1334
- St,
950
+ ze,
1335
951
  {
1336
952
  id: e.id,
1337
- onCommit: (g) => n.field.renameId(g)
953
+ onCommit: (x) => r.field.renameId(x)
1338
954
  }
1339
955
  ),
1340
956
  /* @__PURE__ */ t.jsxs("div", { className: "section-editor-title", children: [
1341
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Section Title" }),
957
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext mie:mb-1", children: "Section Title" }),
1342
958
  /* @__PURE__ */ t.jsx(
1343
959
  "input",
1344
960
  {
1345
- 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",
961
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none",
1346
962
  value: e.title || "",
1347
- onChange: (g) => z("title", g.target.value),
963
+ onChange: (x) => _("title", x.target.value),
1348
964
  placeholder: "e.g., Patient Information"
1349
965
  }
1350
966
  )
1351
967
  ] })
1352
968
  ] }),
1353
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1354
- /* @__PURE__ */ t.jsxs("h3", { className: "text-sm font-semibold text-gray-700 uppercase tracking-wide", children: [
969
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
970
+ /* @__PURE__ */ t.jsxs("h3", { className: "mie:text-sm mie:font-semibold mie:text-mietext mie:uppercase mie:tracking-wide", children: [
1355
971
  "Fields (",
1356
- i.length,
972
+ o.length,
1357
973
  ")"
1358
974
  ] }),
1359
- i.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: [
1360
- /* @__PURE__ */ t.jsx("p", { className: "text-sm text-gray-500", children: "No fields in this section" }),
1361
- /* @__PURE__ */ t.jsx("p", { className: "text-xs text-gray-400 mt-1", children: "Use the Tool Panel to add fields" })
975
+ o.length === 0 ? /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:flex-col mie:items-center mie:justify-center mie:p-6 mie:bg-miebackground mie:border-2 mie:border-dashed mie:border-mieborder mie:rounded-lg mie:text-center", children: [
976
+ /* @__PURE__ */ t.jsx("p", { className: "mie:text-sm mie:text-mietextmuted", children: "No fields in this section" }),
977
+ /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-mietextmuted/70 mie:mt-1", children: "Use the Tool Panel to add fields" })
1362
978
  ] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1363
- /* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
979
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:relative", children: [
1364
980
  /* @__PURE__ */ t.jsx(
1365
981
  "select",
1366
982
  {
1367
- 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",
1368
- value: p || "",
1369
- onChange: (g) => P(g.target.value),
1370
- children: i.map((g) => {
1371
- var D;
1372
- return /* @__PURE__ */ t.jsxs("option", { value: g.id, children: [
1373
- A(g),
1374
- " ",
1375
- (D = de[g.fieldType]) == null ? void 0 : D.label
1376
- ] }, g.id);
1377
- })
983
+ className: "mie:w-full mie:px-3 mie:py-2 mie:pr-10 mie:border mie:border-mieborder mie:rounded mie:bg-miesurface mie:text-mietext mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:appearance-none mie:cursor-pointer",
984
+ value: u || "",
985
+ onChange: (x) => A(x.target.value),
986
+ children: o.map((x) => /* @__PURE__ */ t.jsxs("option", { value: x.id, children: [
987
+ L(x),
988
+ " ",
989
+ K[x.fieldType]?.label
990
+ ] }, x.id))
1378
991
  }
1379
992
  ),
1380
- /* @__PURE__ */ t.jsx(Cr, { className: "absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500 pointer-events-none" })
993
+ /* @__PURE__ */ t.jsx(ht, { className: "mie:absolute mie:right-3 mie:top-1/2 mie:-translate-y-1/2 mie:w-4 mie:h-4 mie:text-mietextmuted mie:pointer-events-none" })
1381
994
  ] }),
1382
- E && /* @__PURE__ */ t.jsxs("div", { className: "space-y-4 p-4 bg-gray-50 border border-gray-200 rounded-lg", children: [
1383
- /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between", children: [
1384
- /* @__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: ((C = de[E.fieldType]) == null ? void 0 : C.label) || E.fieldType }),
995
+ N && /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-4 mie:p-4 mie:bg-miebackground mie:border mie:border-mieborder mie:rounded-lg", children: [
996
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:justify-between", children: [
997
+ /* @__PURE__ */ t.jsx("span", { className: "mie:inline-flex mie:items-center mie:px-2.5 mie:py-0.5 mie:rounded-full mie:text-xs mie:font-medium mie:bg-mieprimary/10 mie:text-mieprimary", children: K[N.fieldType]?.label || N.fieldType }),
1385
998
  /* @__PURE__ */ t.jsxs(
1386
999
  "button",
1387
1000
  {
1388
- 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",
1389
- onClick: L,
1001
+ className: "mie:flex mie:items-center mie:gap-1.5 mie:px-3 mie:py-1.5 mie:text-xs mie:font-medium mie:bg-miesurface mie:text-miedanger mie:hover:text-miedanger mie:hover:bg-miedanger/10 mie:border mie:border-miedanger/50 mie:rounded mie:transition-colors",
1002
+ onClick: I,
1390
1003
  title: "Delete this field",
1391
1004
  children: [
1392
- /* @__PURE__ */ t.jsx(ye, { className: "w-3.5 h-3.5" }),
1005
+ /* @__PURE__ */ t.jsx(re, { className: "mie:w-3.5 mie:h-3.5" }),
1393
1006
  "Delete"
1394
1007
  ]
1395
1008
  }
1396
1009
  )
1397
1010
  ] }),
1398
- /* @__PURE__ */ t.jsx(It, { f: E, onUpdateField: j }),
1399
- E.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "section-editor-default-answer", children: [
1400
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Default Answer" }),
1011
+ /* @__PURE__ */ t.jsx(We, { f: N, onUpdateField: j }),
1012
+ N.fieldType === "input" && /* @__PURE__ */ t.jsxs("div", { className: "section-editor-default-answer", children: [
1013
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext mie:mb-1", children: "Default Answer" }),
1401
1014
  /* @__PURE__ */ t.jsx(
1402
1015
  "input",
1403
1016
  {
1404
- 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",
1405
- value: E.answer || "",
1406
- onChange: (g) => j("answer", g.target.value),
1017
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:bg-miesurface mie:text-mietext mie:rounded mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none",
1018
+ value: N.answer || "",
1019
+ onChange: (x) => j("answer", x.target.value),
1407
1020
  placeholder: "Default value"
1408
1021
  }
1409
1022
  )
1410
1023
  ] }),
1411
- I && R && /* @__PURE__ */ t.jsx(Rt, { field: E, api: R }),
1412
- f && R && /* @__PURE__ */ t.jsx(kt, { field: E, api: R })
1024
+ S && R && /* @__PURE__ */ t.jsx(Ve, { field: N, api: R }),
1025
+ b && R && /* @__PURE__ */ t.jsx(He, { field: N, api: R })
1413
1026
  ] })
1414
1027
  ] })
1415
1028
  ] })
1416
1029
  ] });
1417
1030
  }
1418
- function bt(e, r, n) {
1031
+ function Re(e, i, r) {
1419
1032
  if (e === "expression")
1420
- return Nr.includes(r) ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"] : ["equals", "notEquals", "contains", "empty", "notEmpty"];
1033
+ return xt.includes(i) ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"] : ["equals", "notEquals", "contains", "empty", "notEmpty"];
1421
1034
  switch (e) {
1422
1035
  case "text":
1423
1036
  case "longtext":
1424
- return n === "number" || n === "range" ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "empty", "notEmpty"] : n === "date" || n === "datetime-local" || n === "month" || n === "time" ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "empty", "notEmpty"] : ["equals", "notEquals", "contains", "empty", "notEmpty"];
1037
+ return r === "number" || r === "range" ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "empty", "notEmpty"] : r === "date" || r === "datetime-local" || r === "month" || r === "time" ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "empty", "notEmpty"] : ["equals", "notEquals", "contains", "empty", "notEmpty"];
1425
1038
  case "radio":
1426
1039
  case "dropdown":
1427
1040
  case "boolean":
@@ -1437,7 +1050,7 @@ function bt(e, r, n) {
1437
1050
  return ["equals", "notEquals"];
1438
1051
  }
1439
1052
  }
1440
- function Jr(e) {
1053
+ function Lt(e) {
1441
1054
  switch (e) {
1442
1055
  case "check":
1443
1056
  case "multiselectdropdown":
@@ -1450,7 +1063,7 @@ function Jr(e) {
1450
1063
  return [];
1451
1064
  }
1452
1065
  }
1453
- function Br(e) {
1066
+ function qt(e) {
1454
1067
  switch (e) {
1455
1068
  case "equals":
1456
1069
  return "= (equals)";
@@ -1476,127 +1089,121 @@ function Br(e) {
1476
1089
  return e;
1477
1090
  }
1478
1091
  }
1479
- function vt(e) {
1092
+ function Ae(e) {
1480
1093
  if (e && typeof e == "object") {
1481
- const n = e.id ?? String(e.value ?? ""), a = String(e.value ?? e.label ?? e.id ?? "");
1482
- return { id: n, value: a };
1094
+ const r = e.id ?? String(e.value ?? ""), n = String(e.value ?? e.label ?? e.id ?? "");
1095
+ return { id: r, value: n };
1483
1096
  }
1484
- const r = String(e ?? "");
1485
- return { id: r, value: r };
1486
- }
1487
- function Kr() {
1488
- var H, G, B;
1489
- const e = ie(), r = ae((c) => c.byId), n = ae((c) => c.setEnableWhen), a = ae((c) => c.updateField), o = ((H = e == null ? void 0 : e.selectedFieldId) == null ? void 0 : H.value) ?? null;
1490
- (G = e == null ? void 0 : e.selectedChildId) == null || G.ParentId;
1491
- const i = ((B = e == null ? void 0 : e.selectedChildId) == null ? void 0 : B.ChildId) ?? null, h = o ? r[o] : null, l = (h == null ? void 0 : h.fieldType) === "section", u = m.useMemo(() => l ? Array.isArray(h == null ? void 0 : h.fields) ? h.fields : [] : [], [l, h]), p = m.useMemo(() => !l || !i ? !1 : u.some((c) => c.id === i), [l, i, u]), v = m.useMemo(() => l && p ? `child:${i}` : "", [l, p, i]), [x, P] = m.useState(v);
1492
- m.useEffect(() => {
1493
- P(v);
1494
- }, [v]);
1495
- const A = m.useCallback((c) => {
1496
- if (P(c), !!l)
1497
- if (c && c.startsWith("child:")) {
1498
- const w = c.slice(6);
1499
- e.selectedChildId.set(o, w);
1097
+ const i = String(e ?? "");
1098
+ return { id: i, value: i };
1099
+ }
1100
+ function $t() {
1101
+ const e = B(), i = V((p) => p.byId), r = V((p) => p.setEnableWhen), n = V((p) => p.updateField), s = e?.selectedFieldId?.value ?? null;
1102
+ e?.selectedChildId?.ParentId;
1103
+ const o = e?.selectedChildId?.ChildId ?? null, d = s ? i[s] : null, m = d?.fieldType === "section", c = l.useMemo(() => m ? Array.isArray(d?.fields) ? d.fields : [] : [], [m, d]), u = l.useMemo(() => !m || !o ? !1 : c.some((p) => p.id === o), [m, o, c]), h = l.useMemo(() => m && u ? `child:${o}` : "", [m, u, o]), [g, A] = l.useState(h);
1104
+ l.useEffect(() => {
1105
+ A(h);
1106
+ }, [h]);
1107
+ const L = l.useCallback((p) => {
1108
+ if (A(p), !!m)
1109
+ if (p && p.startsWith("child:")) {
1110
+ const C = p.slice(6);
1111
+ e.selectedChildId.set(s, C);
1500
1112
  } else
1501
1113
  e.selectedChildId.set(null, null);
1502
- }, [l, o, e]), z = !!(l && x && x.startsWith("child:")), E = z ? x.slice(6) : null, F = z ? E : o, R = m.useMemo(() => F ? z ? u.find((c) => c.id === E) ?? null : r[F] ?? null : null, [r, F, z, E, u]), j = m.useMemo(() => {
1503
- var w, S, X;
1504
- const c = [];
1505
- for (const W of Object.values(r))
1506
- if (W)
1507
- if (W.fieldType === "section" && Array.isArray(W.fields)) {
1508
- const Z = ((w = W.title) == null ? void 0 : w.trim()) || "Section";
1509
- W.fields.forEach((y) => {
1510
- var _;
1511
- c.push({
1512
- id: y.id,
1513
- parentId: W.id,
1514
- label: `${Z} › ${((_ = y.question) == null ? void 0 : _.trim()) || y.id}`,
1515
- fieldType: y.fieldType,
1516
- displayFormat: y.displayFormat,
1517
- options: Array.isArray(y.options) ? y.options : []
1114
+ }, [m, s, e]), _ = !!(m && g && g.startsWith("child:")), N = _ ? g.slice(6) : null, O = _ ? N : s, R = l.useMemo(() => O ? _ ? c.find((p) => p.id === N) ?? null : i[O] ?? null : null, [i, O, _, N, c]), j = l.useMemo(() => {
1115
+ const p = [];
1116
+ for (const C of Object.values(i))
1117
+ if (C)
1118
+ if (C.fieldType === "section" && Array.isArray(C.fields)) {
1119
+ const M = C.title?.trim() || "Section";
1120
+ C.fields.forEach((E) => {
1121
+ p.push({
1122
+ id: E.id,
1123
+ parentId: C.id,
1124
+ label: `${M} › ${E.question?.trim() || E.id}`,
1125
+ fieldType: E.fieldType,
1126
+ displayFormat: E.displayFormat,
1127
+ options: Array.isArray(E.options) ? E.options : []
1518
1128
  });
1519
1129
  });
1520
1130
  } else
1521
- c.push({
1522
- id: W.id,
1131
+ p.push({
1132
+ id: C.id,
1523
1133
  parentId: null,
1524
- label: ((S = W.question) == null ? void 0 : S.trim()) || ((X = W.title) == null ? void 0 : X.trim()) || W.id,
1525
- fieldType: W.fieldType,
1526
- displayFormat: W.displayFormat,
1527
- options: Array.isArray(W.options) ? W.options : []
1134
+ label: C.question?.trim() || C.title?.trim() || C.id,
1135
+ fieldType: C.fieldType,
1136
+ displayFormat: C.displayFormat,
1137
+ options: Array.isArray(C.options) ? C.options : []
1528
1138
  });
1529
- return c;
1530
- }, [r]), L = m.useCallback(
1531
- (c) => j.find((w) => w.id === c) || null,
1139
+ return p;
1140
+ }, [i]), I = l.useCallback(
1141
+ (p) => j.find((C) => C.id === p) || null,
1532
1142
  [j]
1533
- ), I = m.useCallback(
1534
- (c) => {
1535
- if (!F) return;
1536
- const w = c && Array.isArray(c.conditions) ? { logic: c.logic || "AND", conditions: c.conditions } : void 0;
1537
- z && o ? a(F, { enableWhen: w }, { sectionId: o }) : n(F, w);
1143
+ ), S = l.useCallback(
1144
+ (p) => {
1145
+ if (!O) return;
1146
+ const C = p && Array.isArray(p.conditions) ? { logic: p.logic || "AND", conditions: p.conditions } : void 0;
1147
+ _ && s ? n(O, { enableWhen: C }, { sectionId: s }) : r(O, C);
1538
1148
  },
1539
- [F, z, o, n, a]
1540
- ), f = m.useMemo(() => R != null && R.enableWhen && Array.isArray(R.enableWhen.conditions) ? { logic: R.enableWhen.logic || "AND", conditions: R.enableWhen.conditions } : { logic: "AND", conditions: [] }, [R]), C = m.useCallback(() => {
1541
- const c = {
1542
- logic: f.logic || "AND",
1149
+ [O, _, s, r, n]
1150
+ ), b = l.useMemo(() => R?.enableWhen && Array.isArray(R.enableWhen.conditions) ? { logic: R.enableWhen.logic || "AND", conditions: R.enableWhen.conditions } : { logic: "AND", conditions: [] }, [R]), x = l.useCallback(() => {
1151
+ const p = {
1152
+ logic: b.logic || "AND",
1543
1153
  conditions: [
1544
- ...Array.isArray(f.conditions) ? f.conditions : [],
1154
+ ...Array.isArray(b.conditions) ? b.conditions : [],
1545
1155
  { targetId: "", operator: "equals", value: "" }
1546
1156
  ]
1547
1157
  };
1548
- I(c);
1549
- }, [f, I]), g = m.useCallback(() => I(null), [I]), D = m.useCallback(
1550
- (c) => {
1551
- const S = (Array.isArray(f.conditions) ? f.conditions : []).filter((X, W) => W !== c);
1552
- I({ ...f, conditions: S });
1158
+ S(p);
1159
+ }, [b, S]), f = l.useCallback(() => S(null), [S]), T = l.useCallback(
1160
+ (p) => {
1161
+ const M = (Array.isArray(b.conditions) ? b.conditions : []).filter((E, F) => F !== p);
1162
+ S({ ...b, conditions: M });
1553
1163
  },
1554
- [f, I]
1555
- ), T = m.useCallback(
1556
- (c, w) => {
1557
- const X = [...Array.isArray(f.conditions) ? f.conditions : []], Z = { ...X[c] || { targetId: "", operator: "equals", value: "" }, ...w };
1558
- if ("targetId" in w) {
1559
- const y = L(Z.targetId), _ = bt(y == null ? void 0 : y.fieldType, y == null ? void 0 : y.displayFormat, y == null ? void 0 : y.inputType);
1560
- _.includes(Z.operator) || (Z.operator = _[0] || "equals");
1561
- const Y = Array.isArray(y == null ? void 0 : y.options) ? y.options.map(vt) : [];
1562
- Y.length > 0 && (new Set(Y.map((te) => te.id)).has(Z.value) || (Z.value = ""));
1164
+ [b, S]
1165
+ ), w = l.useCallback(
1166
+ (p, C) => {
1167
+ const E = [...Array.isArray(b.conditions) ? b.conditions : []], $ = { ...E[p] || { targetId: "", operator: "equals", value: "" }, ...C };
1168
+ if ("targetId" in C) {
1169
+ const z = I($.targetId), H = Re(z?.fieldType, z?.displayFormat, z?.inputType);
1170
+ H.includes($.operator) || ($.operator = H[0] || "equals");
1171
+ const Y = Array.isArray(z?.options) ? z.options.map(Ae) : [];
1172
+ Y.length > 0 && (new Set(Y.map((v) => v.id)).has($.value) || ($.value = ""));
1563
1173
  }
1564
- X[c] = Z, I({ ...f, conditions: X });
1174
+ E[p] = $, S({ ...b, conditions: E });
1565
1175
  },
1566
- [f, L, I]
1567
- ), N = m.useMemo(
1568
- () => j.filter((c) => c.id !== F),
1569
- [j, F]
1570
- ), V = !R || !F;
1571
- return /* @__PURE__ */ t.jsxs("div", { className: "logic-editor-container space-y-4", children: [
1572
- l && /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
1573
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Target Field" }),
1176
+ [b, I, S]
1177
+ ), k = l.useMemo(
1178
+ () => j.filter((p) => p.id !== O),
1179
+ [j, O]
1180
+ ), P = !R || !O;
1181
+ return /* @__PURE__ */ t.jsxs("div", { className: "logic-editor-container mie:space-y-4", children: [
1182
+ m && /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-2", children: [
1183
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: "Target Field" }),
1574
1184
  /* @__PURE__ */ t.jsxs(
1575
1185
  "select",
1576
1186
  {
1577
- 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",
1578
- value: x,
1579
- onChange: (c) => A(c.target.value),
1187
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:cursor-pointer mie:transition-colors",
1188
+ value: g,
1189
+ onChange: (p) => L(p.target.value),
1580
1190
  children: [
1581
1191
  /* @__PURE__ */ t.jsx("option", { value: "", children: "Section (this)" }),
1582
- u.map((c) => {
1583
- var w, S;
1584
- return /* @__PURE__ */ t.jsx("option", { value: `child:${c.id}`, children: ((w = c.question) == null ? void 0 : w.trim()) || ((S = c.title) == null ? void 0 : S.trim()) || c.id }, c.id);
1585
- })
1192
+ c.map((p) => /* @__PURE__ */ t.jsx("option", { value: `child:${p.id}`, children: p.question?.trim() || p.title?.trim() || p.id }, p.id))
1586
1193
  ]
1587
1194
  }
1588
1195
  )
1589
1196
  ] }),
1590
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1591
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
1592
- /* @__PURE__ */ t.jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Logic Operator" }),
1197
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
1198
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-2", children: [
1199
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: "Logic Operator" }),
1593
1200
  /* @__PURE__ */ t.jsxs(
1594
1201
  "select",
1595
1202
  {
1596
- value: f.logic || "AND",
1597
- onChange: (c) => I({ ...f, logic: c.target.value }),
1598
- 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",
1599
- disabled: V,
1203
+ value: b.logic || "AND",
1204
+ onChange: (p) => S({ ...b, logic: p.target.value }),
1205
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:cursor-pointer mie:transition-colors",
1206
+ disabled: P,
1600
1207
  children: [
1601
1208
  /* @__PURE__ */ t.jsx("option", { value: "AND", children: "AND — All conditions must be true" }),
1602
1209
  /* @__PURE__ */ t.jsx("option", { value: "OR", children: "OR — Any condition must be true" })
@@ -1604,14 +1211,14 @@ function Kr() {
1604
1211
  }
1605
1212
  )
1606
1213
  ] }),
1607
- /* @__PURE__ */ t.jsxs("div", { className: "flex gap-2", children: [
1214
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:gap-2", children: [
1608
1215
  /* @__PURE__ */ t.jsx(
1609
1216
  "button",
1610
1217
  {
1611
1218
  type: "button",
1612
- 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",
1613
- onClick: C,
1614
- disabled: V,
1219
+ className: "mie:flex-1 mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-miesurface mie:text-mieprimary mie:border mie:border-mieprimary/50 mie:rounded-lg mie:hover:bg-mieprimary/10 mie:transition-colors mie:disabled:opacity-50 mie:disabled:cursor-not-allowed",
1220
+ onClick: x,
1221
+ disabled: P,
1615
1222
  children: "+ Add Condition"
1616
1223
  }
1617
1224
  ),
@@ -1619,157 +1226,157 @@ function Kr() {
1619
1226
  "button",
1620
1227
  {
1621
1228
  type: "button",
1622
- 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",
1623
- onClick: g,
1624
- disabled: V,
1229
+ className: "mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-miesurface mie:text-miedanger mie:border mie:border-miedanger/50 mie:rounded-lg mie:hover:bg-miedanger/10 mie:transition-colors mie:disabled:opacity-50 mie:disabled:cursor-not-allowed",
1230
+ onClick: f,
1231
+ disabled: P,
1625
1232
  children: "Clear All"
1626
1233
  }
1627
1234
  )
1628
1235
  ] })
1629
1236
  ] }),
1630
- f.conditions.length > 0 && /* @__PURE__ */ t.jsxs("div", { className: "space-y-3", children: [
1631
- /* @__PURE__ */ t.jsxs("h4", { className: "text-sm font-medium text-gray-700", children: [
1237
+ b.conditions.length > 0 && /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
1238
+ /* @__PURE__ */ t.jsxs("h4", { className: "mie:text-sm mie:font-medium mie:text-mietext", children: [
1632
1239
  "Conditions (",
1633
- f.conditions.length,
1240
+ b.conditions.length,
1634
1241
  ")"
1635
1242
  ] }),
1636
- /* @__PURE__ */ t.jsx("div", { className: "space-y-3", children: f.conditions.map((c, w) => {
1637
- const S = L(c.targetId), X = bt(S == null ? void 0 : S.fieldType, S == null ? void 0 : S.displayFormat, S == null ? void 0 : S.inputType), W = S ? Jr(S.fieldType) : [], Z = W.length > 0, y = Array.isArray(S == null ? void 0 : S.options) ? S.options.map(vt) : [], _ = y.length > 0, Y = !["empty", "notEmpty"].includes(c.operator), te = ["greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"].includes(c.operator);
1638
- return /* @__PURE__ */ t.jsxs("div", { className: "p-3 bg-gray-50 border border-gray-200 rounded-lg space-y-2", children: [
1639
- /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
1640
- /* @__PURE__ */ t.jsxs("span", { className: "text-xs font-semibold text-gray-500 uppercase tracking-wide", children: [
1243
+ /* @__PURE__ */ t.jsx("div", { className: "mie:space-y-3", children: b.conditions.map((p, C) => {
1244
+ const M = I(p.targetId), E = Re(M?.fieldType, M?.displayFormat, M?.inputType), F = M ? Lt(M.fieldType) : [], $ = F.length > 0, z = Array.isArray(M?.options) ? M.options.map(Ae) : [], H = z.length > 0, Y = !["empty", "notEmpty"].includes(p.operator), v = ["greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"].includes(p.operator);
1245
+ return /* @__PURE__ */ t.jsxs("div", { className: "mie:p-3 mie:bg-miebackground mie:border mie:border-mieborder mie:rounded-lg mie:space-y-2", children: [
1246
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:justify-between mie:mb-2", children: [
1247
+ /* @__PURE__ */ t.jsxs("span", { className: "mie:text-xs mie:font-semibold mie:text-mietextmuted mie:uppercase mie:tracking-wide", children: [
1641
1248
  "Condition ",
1642
- w + 1
1249
+ C + 1
1643
1250
  ] }),
1644
1251
  /* @__PURE__ */ t.jsx(
1645
1252
  "button",
1646
1253
  {
1647
1254
  type: "button",
1648
- onClick: () => D(w),
1649
- className: "text-gray-400 hover:text-red-600 transition-colors",
1255
+ onClick: () => T(C),
1256
+ className: "mie:bg-transparent mie:text-mietextmuted/70 mie:hover:text-miedanger mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none",
1650
1257
  title: "Remove condition",
1651
- disabled: V,
1652
- children: /* @__PURE__ */ t.jsx(ye, { className: "w-4 h-4" })
1258
+ disabled: P,
1259
+ children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-4 mie:h-4" })
1653
1260
  }
1654
1261
  )
1655
1262
  ] }),
1656
- /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
1263
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-2", children: [
1657
1264
  /* @__PURE__ */ t.jsxs("div", { children: [
1658
- /* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "When Field" }),
1265
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "When Field" }),
1659
1266
  /* @__PURE__ */ t.jsxs(
1660
1267
  "select",
1661
1268
  {
1662
- 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",
1663
- value: c.targetId,
1664
- onChange: ($) => T(w, { targetId: $.target.value }),
1665
- disabled: V,
1269
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:text-sm mie:cursor-pointer mie:transition-colors",
1270
+ value: p.targetId,
1271
+ onChange: (y) => w(C, { targetId: y.target.value }),
1272
+ disabled: P,
1666
1273
  children: [
1667
1274
  /* @__PURE__ */ t.jsx("option", { value: "", children: "— Select field —" }),
1668
- N.map(($) => /* @__PURE__ */ t.jsx("option", { value: $.id, children: $.label }, $.id))
1275
+ k.map((y) => /* @__PURE__ */ t.jsx("option", { value: y.id, children: y.label }, y.id))
1669
1276
  ]
1670
1277
  }
1671
1278
  )
1672
1279
  ] }),
1673
- Z && /* @__PURE__ */ t.jsxs("div", { children: [
1674
- /* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "Property (optional)" }),
1280
+ $ && /* @__PURE__ */ t.jsxs("div", { children: [
1281
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "Property (optional)" }),
1675
1282
  /* @__PURE__ */ t.jsxs(
1676
1283
  "select",
1677
1284
  {
1678
- 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",
1679
- value: c.propertyAccessor || "",
1680
- onChange: ($) => T(w, { propertyAccessor: $.target.value || void 0 }),
1681
- disabled: V || !S,
1285
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:text-sm mie:cursor-pointer mie:transition-colors",
1286
+ value: p.propertyAccessor || "",
1287
+ onChange: (y) => w(C, { propertyAccessor: y.target.value || void 0 }),
1288
+ disabled: P || !M,
1682
1289
  children: [
1683
1290
  /* @__PURE__ */ t.jsx("option", { value: "", children: "— Direct value —" }),
1684
- W.map(($) => /* @__PURE__ */ t.jsxs("option", { value: $, children: [
1291
+ F.map((y) => /* @__PURE__ */ t.jsxs("option", { value: y, children: [
1685
1292
  ".",
1686
- $,
1293
+ y,
1687
1294
  " (get ",
1688
- $,
1295
+ y,
1689
1296
  ")"
1690
- ] }, $))
1297
+ ] }, y))
1691
1298
  ]
1692
1299
  }
1693
1300
  ),
1694
- /* @__PURE__ */ t.jsx("p", { className: "text-xs text-gray-500 mt-1", children: "Use .length or .count to compare the number of items" })
1301
+ /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-mietextmuted mie:mt-1", children: "Use .length or .count to compare the number of items" })
1695
1302
  ] }),
1696
- /* @__PURE__ */ t.jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
1303
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:grid mie:grid-cols-2 mie:gap-2", children: [
1697
1304
  /* @__PURE__ */ t.jsxs("div", { children: [
1698
- /* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "Operator" }),
1305
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "Operator" }),
1699
1306
  /* @__PURE__ */ t.jsx(
1700
1307
  "select",
1701
1308
  {
1702
- 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",
1703
- value: c.operator,
1704
- onChange: ($) => T(w, { operator: $.target.value }),
1705
- disabled: V || !S,
1706
- children: (S ? X : ["equals"]).map(($) => /* @__PURE__ */ t.jsx("option", { value: $, children: Br($) }, $))
1309
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:text-sm mie:cursor-pointer mie:transition-colors",
1310
+ value: p.operator,
1311
+ onChange: (y) => w(C, { operator: y.target.value }),
1312
+ disabled: P || !M,
1313
+ children: (M ? E : ["equals"]).map((y) => /* @__PURE__ */ t.jsx("option", { value: y, children: qt(y) }, y))
1707
1314
  }
1708
1315
  )
1709
1316
  ] }),
1710
1317
  /* @__PURE__ */ t.jsxs("div", { children: [
1711
- /* @__PURE__ */ t.jsx("label", { className: "block text-xs font-medium text-gray-600 mb-1", children: "Value" }),
1712
- Y ? _ && !c.propertyAccessor && !te ? /* @__PURE__ */ t.jsxs(
1318
+ /* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "Value" }),
1319
+ Y ? H && !p.propertyAccessor && !v ? /* @__PURE__ */ t.jsxs(
1713
1320
  "select",
1714
1321
  {
1715
- 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",
1716
- value: c.value,
1717
- onChange: ($) => T(w, { value: $.target.value }),
1718
- disabled: V || !S,
1322
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:text-sm mie:cursor-pointer mie:transition-colors",
1323
+ value: p.value,
1324
+ onChange: (y) => w(C, { value: y.target.value }),
1325
+ disabled: P || !M,
1719
1326
  children: [
1720
1327
  /* @__PURE__ */ t.jsx("option", { value: "", children: "— Select option —" }),
1721
- y.map(($) => /* @__PURE__ */ t.jsx("option", { value: $.id, children: $.value }, $.id))
1328
+ z.map((y) => /* @__PURE__ */ t.jsx("option", { value: y.id, children: y.value }, y.id))
1722
1329
  ]
1723
1330
  }
1724
1331
  ) : /* @__PURE__ */ t.jsx(
1725
1332
  "input",
1726
1333
  {
1727
- 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",
1728
- placeholder: c.propertyAccessor || te ? "Enter number" : "Enter value",
1729
- type: c.propertyAccessor || te ? "number" : "text",
1730
- value: c.value,
1731
- onChange: ($) => T(w, { value: $.target.value }),
1732
- disabled: V || !S
1334
+ className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:focus:border-mieprimary mie:focus:ring-1 mie:focus:ring-mieprimary/30 mie:outline-none mie:bg-miesurface mie:text-mietext mie:text-sm mie:transition-colors",
1335
+ placeholder: p.propertyAccessor || v ? "Enter number" : "Enter value",
1336
+ type: p.propertyAccessor || v ? "number" : "text",
1337
+ value: p.value,
1338
+ onChange: (y) => w(C, { value: y.target.value }),
1339
+ disabled: P || !M
1733
1340
  }
1734
- ) : /* @__PURE__ */ t.jsx("div", { className: "w-full px-3 py-2 border border-gray-200 rounded-lg bg-gray-100 text-sm text-gray-500 flex items-center", children: "(no value needed)" })
1341
+ ) : /* @__PURE__ */ t.jsx("div", { className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-mieborder mie:rounded-lg mie:bg-miebackground mie:text-sm mie:text-mietextmuted mie:flex mie:items-center", children: "(no value needed)" })
1735
1342
  ] })
1736
1343
  ] })
1737
1344
  ] })
1738
- ] }, w);
1345
+ ] }, C);
1739
1346
  }) })
1740
1347
  ] })
1741
1348
  ] });
1742
1349
  }
1743
- function xt() {
1744
- const e = ie(), r = ae(
1745
- m.useCallback(
1746
- (l) => e.selectedFieldId.value ? l.byId[e.selectedFieldId.value] : null,
1747
- [e.selectedFieldId.value]
1350
+ function Pe({ isMobileModal: e = !1 }) {
1351
+ const i = B(), r = V(
1352
+ l.useCallback(
1353
+ (c) => i.selectedFieldId.value ? c.byId[i.selectedFieldId.value] : null,
1354
+ [i.selectedFieldId.value]
1748
1355
  )
1749
- ), [n, a] = m.useState("EDIT"), o = m.useCallback(
1750
- (l, u) => {
1751
- e.selectedChildId.set(l, u);
1356
+ ), [n, s] = l.useState("EDIT"), o = l.useCallback(
1357
+ (c, u) => {
1358
+ i.selectedChildId.set(c, u);
1752
1359
  },
1753
- [e.selectedChildId.set]
1360
+ [i.selectedChildId.set]
1754
1361
  );
1755
- if (m.useEffect(() => {
1756
- e.selectedChildId.set(null, null), a("EDIT");
1757
- }, [e.selectedFieldId.value]), e.state.isPreview) return null;
1758
- const i = !r, h = (r == null ? void 0 : r.fieldType) === "section";
1362
+ if (l.useEffect(() => {
1363
+ i.selectedChildId.set(null, null), s("EDIT");
1364
+ }, [i.selectedFieldId.value]), i.state.isPreview) return null;
1365
+ const d = !r, m = r?.fieldType === "section";
1759
1366
  return /* @__PURE__ */ t.jsxs(
1760
1367
  "div",
1761
1368
  {
1762
- 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)]",
1369
+ className: `edit-panel-container mie:bg-miesurface mie:border mie:border-mieborder mie:rounded-lg mie:shadow-sm ${e ? "mie:overflow-visible mie:max-h-none" : "mie:overflow-y-auto mie:custom-scrollbar mie:max-h-[calc(100svh-24rem)] mie:lg:max-h-[calc(100dvh-20rem)]"}`,
1763
1370
  children: [
1764
- /* @__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: [
1371
+ /* @__PURE__ */ t.jsx("div", { className: "mie:sticky mie:top-0 mie:z-20 mie:bg-miesurface mie:border-b mie:border-mieborder mie:px-4 mie:pt-3 mie:pb-2", children: /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:gap-1 mie:rounded-lg mie:border mie:border-mieborder mie:bg-miebackground mie:p-1 mie:w-full", children: [
1765
1372
  /* @__PURE__ */ t.jsxs(
1766
1373
  "button",
1767
1374
  {
1768
1375
  type: "button",
1769
- onClick: () => a("EDIT"),
1770
- className: `flex-1 flex items-center justify-center gap-2 px-3 py-2 rounded-lg text-xs font-medium transition-colors ${n === "EDIT" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
1376
+ onClick: () => s("EDIT"),
1377
+ className: `mie:flex-1 mie:flex mie:items-center mie:justify-center mie:gap-2 mie:px-3 mie:py-2 mie:rounded-lg mie:text-xs mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${n === "EDIT" ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
1771
1378
  children: [
1772
- /* @__PURE__ */ t.jsx(Or, { className: "w-4 h-4" }),
1379
+ /* @__PURE__ */ t.jsx(bt, { className: "mie:w-4 mie:h-4" }),
1773
1380
  /* @__PURE__ */ t.jsx("span", { children: "Edit" })
1774
1381
  ]
1775
1382
  }
@@ -1778,85 +1385,81 @@ function xt() {
1778
1385
  "button",
1779
1386
  {
1780
1387
  type: "button",
1781
- onClick: () => a("LOGIC"),
1782
- className: `flex-1 flex items-center justify-center gap-2 px-3 py-2 rounded-lg text-xs font-medium transition-colors ${n === "LOGIC" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
1388
+ onClick: () => s("LOGIC"),
1389
+ className: `mie:flex-1 mie:flex mie:items-center mie:justify-center mie:gap-2 mie:px-3 mie:py-2 mie:rounded-lg mie:text-xs mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${n === "LOGIC" ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
1783
1390
  children: [
1784
- /* @__PURE__ */ t.jsx(Tr, { className: "w-4 h-4" }),
1391
+ /* @__PURE__ */ t.jsx(gt, { className: "mie:w-4 mie:h-4" }),
1785
1392
  /* @__PURE__ */ t.jsx("span", { children: "Logic" })
1786
1393
  ]
1787
1394
  }
1788
1395
  )
1789
1396
  ] }) }),
1790
- /* @__PURE__ */ t.jsxs("div", { className: "p-4", children: [
1791
- i && /* @__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." }) }),
1792
- !i && n === "EDIT" && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1793
- !h && /* @__PURE__ */ t.jsx(Hr, { f: r }),
1794
- h && /* @__PURE__ */ t.jsx(
1795
- Yr,
1397
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:p-4", children: [
1398
+ d && /* @__PURE__ */ t.jsx("div", { className: "edit-panel-empty mie:text-mietextmuted", children: /* @__PURE__ */ t.jsx("p", { children: "Select a field in the center panel to edit its properties." }) }),
1399
+ !d && n === "EDIT" && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1400
+ !m && /* @__PURE__ */ t.jsx(_t, { f: r }),
1401
+ m && /* @__PURE__ */ t.jsx(
1402
+ Dt,
1796
1403
  {
1797
1404
  section: r,
1798
1405
  onActiveChildChange: o
1799
1406
  }
1800
1407
  )
1801
1408
  ] }),
1802
- !i && n === "LOGIC" && /* @__PURE__ */ t.jsx(Kr, {})
1409
+ !d && n === "LOGIC" && /* @__PURE__ */ t.jsx($t, {})
1803
1410
  ] })
1804
1411
  ]
1805
1412
  }
1806
1413
  );
1807
1414
  }
1808
- function Gr() {
1809
- const e = ie(), { fields: r } = Sr(e.state.isPreview), n = Ir((l) => l.hideUnsupportedFields), a = ae((l) => l.order), o = m.useRef(null), i = m.useRef(0), h = Be(() => (n ? r.filter((u) => u.fieldType !== "unsupported") : r).map((u) => u.id), [r, n]);
1810
- return m.useEffect(() => {
1811
- var l;
1415
+ function Ut() {
1416
+ const e = B(), { fields: i } = vt(e.state.isPreview), r = yt((m) => m.hideUnsupportedFields), n = V((m) => m.order), s = l.useRef(null), o = l.useRef(0), d = Ee(() => (r ? i.filter((c) => c.fieldType !== "unsupported") : i).map((c) => c.id), [i, r]);
1417
+ return l.useEffect(() => {
1812
1418
  if (!e.state.isPreview) {
1813
- if (a.length > i.current) {
1814
- const u = a[a.length - 1], p = (l = o.current) == null ? void 0 : l.querySelector(`[data-field-id="${u}"]`);
1815
- p && (p.scrollIntoView({ behavior: "smooth", block: "nearest" }), e.selectedFieldId.set(u));
1419
+ if (n.length > o.current) {
1420
+ const m = n[n.length - 1], c = s.current?.querySelector(`[data-field-id="${m}"]`);
1421
+ c && (c.scrollIntoView({ behavior: "smooth", block: "nearest" }), e.selectedFieldId.set(m));
1816
1422
  }
1817
- i.current = a.length;
1423
+ o.current = n.length;
1818
1424
  }
1819
- }, [a, e.selectedFieldId, e.state.isPreview]), /* @__PURE__ */ t.jsx(
1425
+ }, [n, e.selectedFieldId, e.state.isPreview]), /* @__PURE__ */ t.jsx(
1820
1426
  "div",
1821
1427
  {
1822
- ref: o,
1428
+ ref: s,
1823
1429
  className: `form-builder-main
1824
- ${e.state.isPreview ? "max-w-4xl" : "max-w-xl"}
1825
- mx-auto rounded-lg overflow-y-auto max-h-[calc(100svh-13rem)] lg:max-h-[calc(100dvh-11rem)] custom-scrollbar lg:pr-2`,
1430
+ ${e.state.isPreview ? "mie:max-w-4xl" : "mie:max-w-xl"}
1431
+ mie:mx-auto mie:rounded-lg mie:overflow-y-auto mie:max-h-[calc(100svh-13rem)] mie:lg:max-h-[calc(100dvh-11rem)] mie:custom-scrollbar mie:lg:pr-2`,
1826
1432
  onClick: () => !e.state.isPreview && e.selectedFieldId.clear(),
1827
- children: h.length === 0 ? /* @__PURE__ */ t.jsx(Qr, {}) : h.map((l) => /* @__PURE__ */ t.jsx(Xr, { id: l }, l))
1433
+ children: d.length === 0 ? /* @__PURE__ */ t.jsx(Wt, {}) : d.map((m) => /* @__PURE__ */ t.jsx(zt, { id: m }, m))
1828
1434
  }
1829
1435
  );
1830
1436
  }
1831
- const Xr = m.memo(function({ id: r }) {
1832
- const n = ae(m.useCallback((o) => o.byId[r], [r]));
1833
- if (!n) return null;
1834
- const a = Rr(n.fieldType);
1835
- return a ? /* @__PURE__ */ t.jsx("div", { className: "mb-1.5", "data-field-type": n.fieldType, "data-field-id": n.id, children: /* @__PURE__ */ t.jsx(a, { field: n }) }) : null;
1437
+ const zt = l.memo(function({ id: i }) {
1438
+ const r = V(l.useCallback((s) => s.byId[i], [i]));
1439
+ if (!r) return null;
1440
+ const n = jt(r.fieldType);
1441
+ return n ? /* @__PURE__ */ t.jsx("div", { className: "mie:mb-1.5", "data-field-type": r.fieldType, "data-field-id": r.id, children: /* @__PURE__ */ t.jsx(n, { field: r }) }) : null;
1836
1442
  });
1837
- function Qr() {
1443
+ function Wt() {
1838
1444
  return /* @__PURE__ */ t.jsxs(
1839
1445
  "div",
1840
1446
  {
1841
- className: `form-builder-empty-state flex flex-col\r
1842
- items-center justify-center h-72 bg-linear-to-br from-gray-50 \r
1843
- to-gray-100 border-2 border-dashed border-blue-200 rounded-xl \r
1844
- shadow-md text-center px-8 py-10`,
1447
+ className: "form-builder-empty-state mie:flex mie:flex-col mie:items-center mie:justify-center mie:h-72 mie:bg-miebackground mie:border-2 mie:border-dashed mie:border-mieprimary/30 mie:rounded-xl mie:shadow-md mie:text-center mie:px-8 mie:py-10",
1845
1448
  children: [
1846
- /* @__PURE__ */ t.jsx("div", { className: "empty-state-title text-xl font-semibold text-gray-700 mb-2", children: "Forms" }),
1847
- /* @__PURE__ */ t.jsxs("div", { className: "empty-state-description text-base text-gray-500", children: [
1848
- /* @__PURE__ */ t.jsxs("div", { className: "lg:hidden", children: [
1449
+ /* @__PURE__ */ t.jsx("div", { className: "empty-state-title mie:text-xl mie:font-semibold mie:text-mietext mie:mb-2", children: "Forms" }),
1450
+ /* @__PURE__ */ t.jsxs("div", { className: "empty-state-description mie:text-base mie:text-mietextmuted", children: [
1451
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:lg:hidden", children: [
1849
1452
  "Tap the ",
1850
- /* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Tool Panel" }),
1453
+ /* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Tool Panel" }),
1851
1454
  " button to add fields."
1852
1455
  ] }),
1853
- /* @__PURE__ */ t.jsxs("div", { className: "hidden lg:block", children: [
1456
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:hidden mie:lg:block", children: [
1854
1457
  "Add fields using the ",
1855
- /* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Tool Panel" }),
1458
+ /* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Tool Panel" }),
1856
1459
  " on the left.",
1857
1460
  /* @__PURE__ */ t.jsx("br", {}),
1858
1461
  "Edit field properties using the ",
1859
- /* @__PURE__ */ t.jsx("span", { className: "font-semibold text-blue-500", children: "Edit Panel" }),
1462
+ /* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Edit Panel" }),
1860
1463
  " on the right."
1861
1464
  ] })
1862
1465
  ] })
@@ -1864,188 +1467,188 @@ function Qr() {
1864
1467
  }
1865
1468
  );
1866
1469
  }
1867
- function yt(e, r) {
1868
- (r == null || r > e.length) && (r = e.length);
1869
- for (var n = 0, a = Array(r); n < r; n++) a[n] = e[n];
1870
- return a;
1470
+ function Me(e, i) {
1471
+ (i == null || i > e.length) && (i = e.length);
1472
+ for (var r = 0, n = Array(i); r < i; r++) n[r] = e[r];
1473
+ return n;
1871
1474
  }
1872
- function Zr(e) {
1475
+ function Vt(e) {
1873
1476
  if (Array.isArray(e)) return e;
1874
1477
  }
1875
- function en(e, r, n) {
1876
- return (r = ln(r)) in e ? Object.defineProperty(e, r, {
1877
- value: n,
1478
+ function Ht(e, i, r) {
1479
+ return (i = Qt(i)) in e ? Object.defineProperty(e, i, {
1480
+ value: r,
1878
1481
  enumerable: !0,
1879
1482
  configurable: !0,
1880
1483
  writable: !0
1881
- }) : e[r] = n, e;
1484
+ }) : e[i] = r, e;
1882
1485
  }
1883
- function tn(e, r) {
1884
- var n = e == null ? null : typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
1885
- if (n != null) {
1886
- var a, o, i, h, l = [], u = !0, p = !1;
1486
+ function Yt(e, i) {
1487
+ var r = e == null ? null : typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
1488
+ if (r != null) {
1489
+ var n, s, o, d, m = [], c = !0, u = !1;
1887
1490
  try {
1888
- if (i = (n = n.call(e)).next, r !== 0) for (; !(u = (a = i.call(n)).done) && (l.push(a.value), l.length !== r); u = !0) ;
1889
- } catch (v) {
1890
- p = !0, o = v;
1491
+ if (o = (r = r.call(e)).next, i !== 0) for (; !(c = (n = o.call(r)).done) && (m.push(n.value), m.length !== i); c = !0) ;
1492
+ } catch (h) {
1493
+ u = !0, s = h;
1891
1494
  } finally {
1892
1495
  try {
1893
- if (!u && n.return != null && (h = n.return(), Object(h) !== h)) return;
1496
+ if (!c && r.return != null && (d = r.return(), Object(d) !== d)) return;
1894
1497
  } finally {
1895
- if (p) throw o;
1498
+ if (u) throw s;
1896
1499
  }
1897
1500
  }
1898
- return l;
1501
+ return m;
1899
1502
  }
1900
1503
  }
1901
- function rn() {
1504
+ function Jt() {
1902
1505
  throw new TypeError(`Invalid attempt to destructure non-iterable instance.
1903
1506
  In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
1904
1507
  }
1905
- function jt(e, r) {
1906
- var n = Object.keys(e);
1508
+ function Fe(e, i) {
1509
+ var r = Object.keys(e);
1907
1510
  if (Object.getOwnPropertySymbols) {
1908
- var a = Object.getOwnPropertySymbols(e);
1909
- r && (a = a.filter(function(o) {
1910
- return Object.getOwnPropertyDescriptor(e, o).enumerable;
1911
- })), n.push.apply(n, a);
1511
+ var n = Object.getOwnPropertySymbols(e);
1512
+ i && (n = n.filter(function(s) {
1513
+ return Object.getOwnPropertyDescriptor(e, s).enumerable;
1514
+ })), r.push.apply(r, n);
1912
1515
  }
1913
- return n;
1914
- }
1915
- function wt(e) {
1916
- for (var r = 1; r < arguments.length; r++) {
1917
- var n = arguments[r] != null ? arguments[r] : {};
1918
- r % 2 ? jt(Object(n), !0).forEach(function(a) {
1919
- en(e, a, n[a]);
1920
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : jt(Object(n)).forEach(function(a) {
1921
- Object.defineProperty(e, a, Object.getOwnPropertyDescriptor(n, a));
1516
+ return r;
1517
+ }
1518
+ function _e(e) {
1519
+ for (var i = 1; i < arguments.length; i++) {
1520
+ var r = arguments[i] != null ? arguments[i] : {};
1521
+ i % 2 ? Fe(Object(r), !0).forEach(function(n) {
1522
+ Ht(e, n, r[n]);
1523
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Fe(Object(r)).forEach(function(n) {
1524
+ Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
1922
1525
  });
1923
1526
  }
1924
1527
  return e;
1925
1528
  }
1926
- function nn(e, r) {
1529
+ function Bt(e, i) {
1927
1530
  if (e == null) return {};
1928
- var n, a, o = sn(e, r);
1531
+ var r, n, s = Gt(e, i);
1929
1532
  if (Object.getOwnPropertySymbols) {
1930
- var i = Object.getOwnPropertySymbols(e);
1931
- for (a = 0; a < i.length; a++) n = i[a], r.indexOf(n) === -1 && {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
1533
+ var o = Object.getOwnPropertySymbols(e);
1534
+ for (n = 0; n < o.length; n++) r = o[n], i.indexOf(r) === -1 && {}.propertyIsEnumerable.call(e, r) && (s[r] = e[r]);
1932
1535
  }
1933
- return o;
1536
+ return s;
1934
1537
  }
1935
- function sn(e, r) {
1538
+ function Gt(e, i) {
1936
1539
  if (e == null) return {};
1937
- var n = {};
1938
- for (var a in e) if ({}.hasOwnProperty.call(e, a)) {
1939
- if (r.indexOf(a) !== -1) continue;
1940
- n[a] = e[a];
1540
+ var r = {};
1541
+ for (var n in e) if ({}.hasOwnProperty.call(e, n)) {
1542
+ if (i.indexOf(n) !== -1) continue;
1543
+ r[n] = e[n];
1941
1544
  }
1942
- return n;
1545
+ return r;
1943
1546
  }
1944
- function an(e, r) {
1945
- return Zr(e) || tn(e, r) || cn(e, r) || rn();
1547
+ function Kt(e, i) {
1548
+ return Vt(e) || Yt(e, i) || Zt(e, i) || Jt();
1946
1549
  }
1947
- function on(e, r) {
1550
+ function Xt(e, i) {
1948
1551
  if (typeof e != "object" || !e) return e;
1949
- var n = e[Symbol.toPrimitive];
1950
- if (n !== void 0) {
1951
- var a = n.call(e, r);
1952
- if (typeof a != "object") return a;
1552
+ var r = e[Symbol.toPrimitive];
1553
+ if (r !== void 0) {
1554
+ var n = r.call(e, i);
1555
+ if (typeof n != "object") return n;
1953
1556
  throw new TypeError("@@toPrimitive must return a primitive value.");
1954
1557
  }
1955
- return (r === "string" ? String : Number)(e);
1558
+ return (i === "string" ? String : Number)(e);
1956
1559
  }
1957
- function ln(e) {
1958
- var r = on(e, "string");
1959
- return typeof r == "symbol" ? r : r + "";
1560
+ function Qt(e) {
1561
+ var i = Xt(e, "string");
1562
+ return typeof i == "symbol" ? i : i + "";
1960
1563
  }
1961
- function cn(e, r) {
1564
+ function Zt(e, i) {
1962
1565
  if (e) {
1963
- if (typeof e == "string") return yt(e, r);
1964
- var n = {}.toString.call(e).slice(8, -1);
1965
- return n === "Object" && e.constructor && (n = e.constructor.name), n === "Map" || n === "Set" ? Array.from(e) : n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? yt(e, r) : void 0;
1566
+ if (typeof e == "string") return Me(e, i);
1567
+ var r = {}.toString.call(e).slice(8, -1);
1568
+ return r === "Object" && e.constructor && (r = e.constructor.name), r === "Map" || r === "Set" ? Array.from(e) : r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? Me(e, i) : void 0;
1966
1569
  }
1967
1570
  }
1968
- function un(e, r, n) {
1969
- return r in e ? Object.defineProperty(e, r, {
1970
- value: n,
1571
+ function ei(e, i, r) {
1572
+ return i in e ? Object.defineProperty(e, i, {
1573
+ value: r,
1971
1574
  enumerable: !0,
1972
1575
  configurable: !0,
1973
1576
  writable: !0
1974
- }) : e[r] = n, e;
1577
+ }) : e[i] = r, e;
1975
1578
  }
1976
- function Et(e, r) {
1977
- var n = Object.keys(e);
1579
+ function De(e, i) {
1580
+ var r = Object.keys(e);
1978
1581
  if (Object.getOwnPropertySymbols) {
1979
- var a = Object.getOwnPropertySymbols(e);
1980
- r && (a = a.filter(function(o) {
1981
- return Object.getOwnPropertyDescriptor(e, o).enumerable;
1982
- })), n.push.apply(n, a);
1582
+ var n = Object.getOwnPropertySymbols(e);
1583
+ i && (n = n.filter(function(s) {
1584
+ return Object.getOwnPropertyDescriptor(e, s).enumerable;
1585
+ })), r.push.apply(r, n);
1983
1586
  }
1984
- return n;
1985
- }
1986
- function Ct(e) {
1987
- for (var r = 1; r < arguments.length; r++) {
1988
- var n = arguments[r] != null ? arguments[r] : {};
1989
- r % 2 ? Et(Object(n), !0).forEach(function(a) {
1990
- un(e, a, n[a]);
1991
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : Et(Object(n)).forEach(function(a) {
1992
- Object.defineProperty(e, a, Object.getOwnPropertyDescriptor(n, a));
1587
+ return r;
1588
+ }
1589
+ function Le(e) {
1590
+ for (var i = 1; i < arguments.length; i++) {
1591
+ var r = arguments[i] != null ? arguments[i] : {};
1592
+ i % 2 ? De(Object(r), !0).forEach(function(n) {
1593
+ ei(e, n, r[n]);
1594
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : De(Object(r)).forEach(function(n) {
1595
+ Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
1993
1596
  });
1994
1597
  }
1995
1598
  return e;
1996
1599
  }
1997
- function dn() {
1998
- for (var e = arguments.length, r = new Array(e), n = 0; n < e; n++)
1999
- r[n] = arguments[n];
2000
- return function(a) {
2001
- return r.reduceRight(function(o, i) {
2002
- return i(o);
2003
- }, a);
1600
+ function ti() {
1601
+ for (var e = arguments.length, i = new Array(e), r = 0; r < e; r++)
1602
+ i[r] = arguments[r];
1603
+ return function(n) {
1604
+ return i.reduceRight(function(s, o) {
1605
+ return o(s);
1606
+ }, n);
2004
1607
  };
2005
1608
  }
2006
- function ve(e) {
2007
- return function r() {
2008
- for (var n = this, a = arguments.length, o = new Array(a), i = 0; i < a; i++)
2009
- o[i] = arguments[i];
2010
- return o.length >= e.length ? e.apply(this, o) : function() {
2011
- for (var h = arguments.length, l = new Array(h), u = 0; u < h; u++)
2012
- l[u] = arguments[u];
2013
- return r.apply(n, [].concat(o, l));
1609
+ function te(e) {
1610
+ return function i() {
1611
+ for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
1612
+ s[o] = arguments[o];
1613
+ return s.length >= e.length ? e.apply(this, s) : function() {
1614
+ for (var d = arguments.length, m = new Array(d), c = 0; c < d; c++)
1615
+ m[c] = arguments[c];
1616
+ return i.apply(r, [].concat(s, m));
2014
1617
  };
2015
1618
  };
2016
1619
  }
2017
- function Me(e) {
1620
+ function he(e) {
2018
1621
  return {}.toString.call(e).includes("Object");
2019
1622
  }
2020
- function fn(e) {
1623
+ function ii(e) {
2021
1624
  return !Object.keys(e).length;
2022
1625
  }
2023
- function je(e) {
1626
+ function ne(e) {
2024
1627
  return typeof e == "function";
2025
1628
  }
2026
- function mn(e, r) {
2027
- return Object.prototype.hasOwnProperty.call(e, r);
1629
+ function ri(e, i) {
1630
+ return Object.prototype.hasOwnProperty.call(e, i);
2028
1631
  }
2029
- function hn(e, r) {
2030
- return Me(r) || ce("changeType"), Object.keys(r).some(function(n) {
2031
- return !mn(e, n);
2032
- }) && ce("changeField"), r;
1632
+ function ni(e, i) {
1633
+ return he(i) || G("changeType"), Object.keys(i).some(function(r) {
1634
+ return !ri(e, r);
1635
+ }) && G("changeField"), i;
2033
1636
  }
2034
- function pn(e) {
2035
- je(e) || ce("selectorType");
1637
+ function si(e) {
1638
+ ne(e) || G("selectorType");
2036
1639
  }
2037
- function gn(e) {
2038
- je(e) || Me(e) || ce("handlerType"), Me(e) && Object.values(e).some(function(r) {
2039
- return !je(r);
2040
- }) && ce("handlersType");
1640
+ function oi(e) {
1641
+ ne(e) || he(e) || G("handlerType"), he(e) && Object.values(e).some(function(i) {
1642
+ return !ne(i);
1643
+ }) && G("handlersType");
2041
1644
  }
2042
- function bn(e) {
2043
- e || ce("initialIsRequired"), Me(e) || ce("initialType"), fn(e) && ce("initialContent");
1645
+ function ai(e) {
1646
+ e || G("initialIsRequired"), he(e) || G("initialType"), ii(e) && G("initialContent");
2044
1647
  }
2045
- function vn(e, r) {
2046
- throw new Error(e[r] || e.default);
1648
+ function mi(e, i) {
1649
+ throw new Error(e[i] || e.default);
2047
1650
  }
2048
- var xn = {
1651
+ var li = {
2049
1652
  initialIsRequired: "initial state is required",
2050
1653
  initialType: "initial state should be an object",
2051
1654
  initialContent: "initial state shouldn't be an empty object",
@@ -2055,76 +1658,76 @@ var xn = {
2055
1658
  changeType: "provided value of changes should be an object",
2056
1659
  changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
2057
1660
  default: "an unknown error accured in `state-local` package"
2058
- }, ce = ve(vn)(xn), Ie = {
2059
- changes: hn,
2060
- selector: pn,
2061
- handler: gn,
2062
- initial: bn
1661
+ }, G = te(mi)(li), le = {
1662
+ changes: ni,
1663
+ selector: si,
1664
+ handler: oi,
1665
+ initial: ai
2063
1666
  };
2064
- function yn(e) {
2065
- var r = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
2066
- Ie.initial(e), Ie.handler(r);
2067
- var n = {
1667
+ function ci(e) {
1668
+ var i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
1669
+ le.initial(e), le.handler(i);
1670
+ var r = {
2068
1671
  current: e
2069
- }, a = ve(En)(n, r), o = ve(wn)(n), i = ve(Ie.changes)(e), h = ve(jn)(n);
2070
- function l() {
2071
- var p = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(v) {
2072
- return v;
1672
+ }, n = te(fi)(r, i), s = te(ui)(r), o = te(le.changes)(e), d = te(di)(r);
1673
+ function m() {
1674
+ var u = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : function(h) {
1675
+ return h;
2073
1676
  };
2074
- return Ie.selector(p), p(n.current);
1677
+ return le.selector(u), u(r.current);
2075
1678
  }
2076
- function u(p) {
2077
- dn(a, o, i, h)(p);
1679
+ function c(u) {
1680
+ ti(n, s, o, d)(u);
2078
1681
  }
2079
- return [l, u];
1682
+ return [m, c];
2080
1683
  }
2081
- function jn(e, r) {
2082
- return je(r) ? r(e.current) : r;
1684
+ function di(e, i) {
1685
+ return ne(i) ? i(e.current) : i;
2083
1686
  }
2084
- function wn(e, r) {
2085
- return e.current = Ct(Ct({}, e.current), r), r;
1687
+ function ui(e, i) {
1688
+ return e.current = Le(Le({}, e.current), i), i;
2086
1689
  }
2087
- function En(e, r, n) {
2088
- return je(r) ? r(e.current) : Object.keys(n).forEach(function(a) {
2089
- var o;
2090
- return (o = r[a]) === null || o === void 0 ? void 0 : o.call(r, e.current[a]);
2091
- }), n;
1690
+ function fi(e, i, r) {
1691
+ return ne(i) ? i(e.current) : Object.keys(r).forEach(function(n) {
1692
+ var s;
1693
+ return (s = i[n]) === null || s === void 0 ? void 0 : s.call(i, e.current[n]);
1694
+ }), r;
2092
1695
  }
2093
- var Cn = {
2094
- create: yn
2095
- }, Nn = {
1696
+ var pi = {
1697
+ create: ci
1698
+ }, hi = {
2096
1699
  paths: {
2097
- vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.54.0/min/vs"
1700
+ vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.55.1/min/vs"
2098
1701
  }
2099
1702
  };
2100
- function On(e) {
2101
- return function r() {
2102
- for (var n = this, a = arguments.length, o = new Array(a), i = 0; i < a; i++)
2103
- o[i] = arguments[i];
2104
- return o.length >= e.length ? e.apply(this, o) : function() {
2105
- for (var h = arguments.length, l = new Array(h), u = 0; u < h; u++)
2106
- l[u] = arguments[u];
2107
- return r.apply(n, [].concat(o, l));
1703
+ function xi(e) {
1704
+ return function i() {
1705
+ for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
1706
+ s[o] = arguments[o];
1707
+ return s.length >= e.length ? e.apply(this, s) : function() {
1708
+ for (var d = arguments.length, m = new Array(d), c = 0; c < d; c++)
1709
+ m[c] = arguments[c];
1710
+ return i.apply(r, [].concat(s, m));
2108
1711
  };
2109
1712
  };
2110
1713
  }
2111
- function Tn(e) {
1714
+ function bi(e) {
2112
1715
  return {}.toString.call(e).includes("Object");
2113
1716
  }
2114
- function Sn(e) {
2115
- return e || Nt("configIsRequired"), Tn(e) || Nt("configType"), e.urls ? (In(), {
1717
+ function gi(e) {
1718
+ return e || qe("configIsRequired"), bi(e) || qe("configType"), e.urls ? (vi(), {
2116
1719
  paths: {
2117
1720
  vs: e.urls.monacoBase
2118
1721
  }
2119
1722
  }) : e;
2120
1723
  }
2121
- function In() {
2122
- console.warn(Pt.deprecation);
1724
+ function vi() {
1725
+ console.warn(Ye.deprecation);
2123
1726
  }
2124
- function Rn(e, r) {
2125
- throw new Error(e[r] || e.default);
1727
+ function yi(e, i) {
1728
+ throw new Error(e[i] || e.default);
2126
1729
  }
2127
- var Pt = {
1730
+ var Ye = {
2128
1731
  configIsRequired: "the configuration object is required",
2129
1732
  configType: "the configuration object should be an object",
2130
1733
  default: "an unknown error accured in `@monaco-editor/loader` package",
@@ -2138,337 +1741,333 @@ var Pt = {
2138
1741
 
2139
1742
  For more please check the link https://github.com/suren-atoyan/monaco-loader#config
2140
1743
  `
2141
- }, Nt = On(Rn)(Pt), kn = {
2142
- config: Sn
2143
- }, Pn = function() {
2144
- for (var r = arguments.length, n = new Array(r), a = 0; a < r; a++)
2145
- n[a] = arguments[a];
2146
- return function(o) {
2147
- return n.reduceRight(function(i, h) {
2148
- return h(i);
2149
- }, o);
1744
+ }, qe = xi(yi)(Ye), ji = {
1745
+ config: gi
1746
+ }, wi = function() {
1747
+ for (var i = arguments.length, r = new Array(i), n = 0; n < i; n++)
1748
+ r[n] = arguments[n];
1749
+ return function(s) {
1750
+ return r.reduceRight(function(o, d) {
1751
+ return d(o);
1752
+ }, s);
2150
1753
  };
2151
1754
  };
2152
- function At(e, r) {
2153
- return Object.keys(r).forEach(function(n) {
2154
- r[n] instanceof Object && e[n] && Object.assign(r[n], At(e[n], r[n]));
2155
- }), wt(wt({}, e), r);
1755
+ function Je(e, i) {
1756
+ return Object.keys(i).forEach(function(r) {
1757
+ i[r] instanceof Object && e[r] && Object.assign(i[r], Je(e[r], i[r]));
1758
+ }), _e(_e({}, e), i);
2156
1759
  }
2157
- var An = {
1760
+ var Ei = {
2158
1761
  type: "cancelation",
2159
1762
  msg: "operation is manually canceled"
2160
1763
  };
2161
- function He(e) {
2162
- var r = !1, n = new Promise(function(a, o) {
2163
- e.then(function(i) {
2164
- return r ? o(An) : a(i);
2165
- }), e.catch(o);
1764
+ function ye(e) {
1765
+ var i = !1, r = new Promise(function(n, s) {
1766
+ e.then(function(o) {
1767
+ return i ? s(Ei) : n(o);
1768
+ }), e.catch(s);
2166
1769
  });
2167
- return n.cancel = function() {
2168
- return r = !0;
2169
- }, n;
1770
+ return r.cancel = function() {
1771
+ return i = !0;
1772
+ }, r;
2170
1773
  }
2171
- var _n = ["monaco"], Mn = Cn.create({
2172
- config: Nn,
1774
+ var Ni = ["monaco"], Ci = pi.create({
1775
+ config: hi,
2173
1776
  isInitialized: !1,
2174
1777
  resolve: null,
2175
1778
  reject: null,
2176
1779
  monaco: null
2177
- }), _t = an(Mn, 2), we = _t[0], Fe = _t[1];
2178
- function Fn(e) {
2179
- var r = kn.config(e), n = r.monaco, a = nn(r, _n);
2180
- Fe(function(o) {
1780
+ }), Be = Kt(Ci, 2), se = Be[0], xe = Be[1];
1781
+ function Oi(e) {
1782
+ var i = ji.config(e), r = i.monaco, n = Bt(i, Ni);
1783
+ xe(function(s) {
2181
1784
  return {
2182
- config: At(o.config, a),
2183
- monaco: n
1785
+ config: Je(s.config, n),
1786
+ monaco: r
2184
1787
  };
2185
1788
  });
2186
1789
  }
2187
- function Dn() {
2188
- var e = we(function(r) {
2189
- var n = r.monaco, a = r.isInitialized, o = r.resolve;
1790
+ function Ti() {
1791
+ var e = se(function(i) {
1792
+ var r = i.monaco, n = i.isInitialized, s = i.resolve;
2190
1793
  return {
2191
- monaco: n,
2192
- isInitialized: a,
2193
- resolve: o
1794
+ monaco: r,
1795
+ isInitialized: n,
1796
+ resolve: s
2194
1797
  };
2195
1798
  });
2196
1799
  if (!e.isInitialized) {
2197
- if (Fe({
1800
+ if (xe({
2198
1801
  isInitialized: !0
2199
1802
  }), e.monaco)
2200
- return e.resolve(e.monaco), He(Ye);
1803
+ return e.resolve(e.monaco), ye(je);
2201
1804
  if (window.monaco && window.monaco.editor)
2202
- return Mt(window.monaco), e.resolve(window.monaco), He(Ye);
2203
- Pn(Ln, qn)(Wn);
1805
+ return Ge(window.monaco), e.resolve(window.monaco), ye(je);
1806
+ wi(Ii, ki)(Ri);
2204
1807
  }
2205
- return He(Ye);
1808
+ return ye(je);
2206
1809
  }
2207
- function Ln(e) {
1810
+ function Ii(e) {
2208
1811
  return document.body.appendChild(e);
2209
1812
  }
2210
- function $n(e) {
2211
- var r = document.createElement("script");
2212
- return e && (r.src = e), r;
1813
+ function Si(e) {
1814
+ var i = document.createElement("script");
1815
+ return e && (i.src = e), i;
2213
1816
  }
2214
- function qn(e) {
2215
- var r = we(function(a) {
2216
- var o = a.config, i = a.reject;
1817
+ function ki(e) {
1818
+ var i = se(function(n) {
1819
+ var s = n.config, o = n.reject;
2217
1820
  return {
2218
- config: o,
2219
- reject: i
1821
+ config: s,
1822
+ reject: o
2220
1823
  };
2221
- }), n = $n("".concat(r.config.paths.vs, "/loader.js"));
2222
- return n.onload = function() {
1824
+ }), r = Si("".concat(i.config.paths.vs, "/loader.js"));
1825
+ return r.onload = function() {
2223
1826
  return e();
2224
- }, n.onerror = r.reject, n;
1827
+ }, r.onerror = i.reject, r;
2225
1828
  }
2226
- function Wn() {
2227
- var e = we(function(n) {
2228
- var a = n.config, o = n.resolve, i = n.reject;
1829
+ function Ri() {
1830
+ var e = se(function(r) {
1831
+ var n = r.config, s = r.resolve, o = r.reject;
2229
1832
  return {
2230
- config: a,
2231
- resolve: o,
2232
- reject: i
1833
+ config: n,
1834
+ resolve: s,
1835
+ reject: o
2233
1836
  };
2234
- }), r = window.require;
2235
- r.config(e.config), r(["vs/editor/editor.main"], function(n) {
2236
- var a = n.m;
2237
- Mt(a), e.resolve(a);
2238
- }, function(n) {
2239
- e.reject(n);
1837
+ }), i = window.require;
1838
+ i.config(e.config), i(["vs/editor/editor.main"], function(r) {
1839
+ var n = r.m || r;
1840
+ Ge(n), e.resolve(n);
1841
+ }, function(r) {
1842
+ e.reject(r);
2240
1843
  });
2241
1844
  }
2242
- function Mt(e) {
2243
- we().monaco || Fe({
1845
+ function Ge(e) {
1846
+ se().monaco || xe({
2244
1847
  monaco: e
2245
1848
  });
2246
1849
  }
2247
- function Vn() {
2248
- return we(function(e) {
2249
- var r = e.monaco;
2250
- return r;
1850
+ function Ai() {
1851
+ return se(function(e) {
1852
+ var i = e.monaco;
1853
+ return i;
2251
1854
  });
2252
1855
  }
2253
- var Ye = new Promise(function(e, r) {
2254
- return Fe({
1856
+ var je = new Promise(function(e, i) {
1857
+ return xe({
2255
1858
  resolve: e,
2256
- reject: r
1859
+ reject: i
2257
1860
  });
2258
- }), Ft = {
2259
- config: Fn,
2260
- init: Dn,
2261
- __getMonacoInstance: Vn
2262
- }, Un = { wrapper: { display: "flex", position: "relative", textAlign: "initial" }, fullWidth: { width: "100%" }, hide: { display: "none" } }, Je = Un, zn = { container: { display: "flex", height: "100%", width: "100%", justifyContent: "center", alignItems: "center" } }, Hn = zn;
2263
- function Yn({ children: e }) {
2264
- return m.createElement("div", { style: Hn.container }, e);
2265
- }
2266
- var Jn = Yn, Bn = Jn;
2267
- function Kn({ width: e, height: r, isEditorReady: n, loading: a, _ref: o, className: i, wrapperProps: h }) {
2268
- return m.createElement("section", { style: { ...Je.wrapper, width: e, height: r }, ...h }, !n && m.createElement(Bn, null, a), m.createElement("div", { ref: o, style: { ...Je.fullWidth, ...!n && Je.hide }, className: i }));
2269
- }
2270
- var Gn = Kn, Dt = Ge(Gn);
2271
- function Xn(e) {
2272
- le(e, []);
2273
- }
2274
- var Lt = Xn;
2275
- function Qn(e, r, n = !0) {
2276
- let a = Q(!0);
2277
- le(a.current || !n ? () => {
2278
- a.current = !1;
2279
- } : e, r);
2280
- }
2281
- var ne = Qn;
2282
- function xe() {
2283
- }
2284
- function he(e, r, n, a) {
2285
- return Zn(e, a) || es(e, r, n, a);
2286
- }
2287
- function Zn(e, r) {
2288
- return e.editor.getModel($t(e, r));
2289
- }
2290
- function es(e, r, n, a) {
2291
- return e.editor.createModel(r, n, a ? $t(e, a) : void 0);
2292
- }
2293
- function $t(e, r) {
2294
- return e.Uri.parse(r);
2295
- }
2296
- function ts({ original: e, modified: r, language: n, originalLanguage: a, modifiedLanguage: o, originalModelPath: i, modifiedModelPath: h, keepCurrentOriginalModel: l = !1, keepCurrentModifiedModel: u = !1, theme: p = "light", loading: v = "Loading...", options: x = {}, height: P = "100%", width: A = "100%", className: z, wrapperProps: E = {}, beforeMount: F = xe, onMount: R = xe }) {
2297
- let [j, L] = Pe(!1), [I, f] = Pe(!0), C = Q(null), g = Q(null), D = Q(null), T = Q(R), N = Q(F), V = Q(!1);
2298
- Lt(() => {
2299
- let c = Ft.init();
2300
- return c.then((w) => (g.current = w) && f(!1)).catch((w) => (w == null ? void 0 : w.type) !== "cancelation" && console.error("Monaco initialization: error:", w)), () => C.current ? B() : c.cancel();
2301
- }), ne(() => {
2302
- if (C.current && g.current) {
2303
- let c = C.current.getOriginalEditor(), w = he(g.current, e || "", a || n || "text", i || "");
2304
- w !== c.getModel() && c.setModel(w);
2305
- }
2306
- }, [i], j), ne(() => {
2307
- if (C.current && g.current) {
2308
- let c = C.current.getModifiedEditor(), w = he(g.current, r || "", o || n || "text", h || "");
2309
- w !== c.getModel() && c.setModel(w);
2310
- }
2311
- }, [h], j), ne(() => {
2312
- let c = C.current.getModifiedEditor();
2313
- c.getOption(g.current.editor.EditorOption.readOnly) ? c.setValue(r || "") : r !== c.getValue() && (c.executeEdits("", [{ range: c.getModel().getFullModelRange(), text: r || "", forceMoveMarkers: !0 }]), c.pushUndoStop());
2314
- }, [r], j), ne(() => {
2315
- var c, w;
2316
- (w = (c = C.current) == null ? void 0 : c.getModel()) == null || w.original.setValue(e || "");
2317
- }, [e], j), ne(() => {
2318
- let { original: c, modified: w } = C.current.getModel();
2319
- g.current.editor.setModelLanguage(c, a || n || "text"), g.current.editor.setModelLanguage(w, o || n || "text");
2320
- }, [n, a, o], j), ne(() => {
2321
- var c;
2322
- (c = g.current) == null || c.editor.setTheme(p);
2323
- }, [p], j), ne(() => {
2324
- var c;
2325
- (c = C.current) == null || c.updateOptions(x);
2326
- }, [x], j);
2327
- let H = ke(() => {
2328
- var S;
2329
- if (!g.current) return;
2330
- N.current(g.current);
2331
- let c = he(g.current, e || "", a || n || "text", i || ""), w = he(g.current, r || "", o || n || "text", h || "");
2332
- (S = C.current) == null || S.setModel({ original: c, modified: w });
2333
- }, [n, r, o, e, a, i, h]), G = ke(() => {
2334
- var c;
2335
- !V.current && D.current && (C.current = g.current.editor.createDiffEditor(D.current, { automaticLayout: !0, ...x }), H(), (c = g.current) == null || c.editor.setTheme(p), L(!0), V.current = !0);
2336
- }, [x, p, H]);
2337
- le(() => {
2338
- j && T.current(C.current, g.current);
2339
- }, [j]), le(() => {
2340
- !I && !j && G();
2341
- }, [I, j, G]);
2342
- function B() {
2343
- var w, S, X, W;
2344
- let c = (w = C.current) == null ? void 0 : w.getModel();
2345
- l || ((S = c == null ? void 0 : c.original) == null || S.dispose()), u || ((X = c == null ? void 0 : c.modified) == null || X.dispose()), (W = C.current) == null || W.dispose();
1861
+ }), Ke = {
1862
+ config: Oi,
1863
+ init: Ti,
1864
+ __getMonacoInstance: Ai
1865
+ }, Pi = { wrapper: { display: "flex", position: "relative", textAlign: "initial" }, fullWidth: { width: "100%" }, hide: { display: "none" } }, we = Pi, Mi = { container: { display: "flex", height: "100%", width: "100%", justifyContent: "center", alignItems: "center" } }, Fi = Mi;
1866
+ function _i({ children: e }) {
1867
+ return l.createElement("div", { style: Fi.container }, e);
1868
+ }
1869
+ var Di = _i, Li = Di;
1870
+ function qi({ width: e, height: i, isEditorReady: r, loading: n, _ref: s, className: o, wrapperProps: d }) {
1871
+ return l.createElement("section", { style: { ...we.wrapper, width: e, height: i }, ...d }, !r && l.createElement(Li, null, n), l.createElement("div", { ref: s, style: { ...we.fullWidth, ...!r && we.hide }, className: o }));
1872
+ }
1873
+ var $i = qi, Xe = Ce($i);
1874
+ function Ui(e) {
1875
+ J(e, []);
1876
+ }
1877
+ var Qe = Ui;
1878
+ function zi(e, i, r = !0) {
1879
+ let n = U(!0);
1880
+ J(n.current || !r ? () => {
1881
+ n.current = !1;
1882
+ } : e, i);
1883
+ }
1884
+ var W = zi;
1885
+ function ie() {
1886
+ }
1887
+ function Q(e, i, r, n) {
1888
+ return Wi(e, n) || Vi(e, i, r, n);
1889
+ }
1890
+ function Wi(e, i) {
1891
+ return e.editor.getModel(Ze(e, i));
1892
+ }
1893
+ function Vi(e, i, r, n) {
1894
+ return e.editor.createModel(i, r, n ? Ze(e, n) : void 0);
1895
+ }
1896
+ function Ze(e, i) {
1897
+ return e.Uri.parse(i);
1898
+ }
1899
+ function Hi({ original: e, modified: i, language: r, originalLanguage: n, modifiedLanguage: s, originalModelPath: o, modifiedModelPath: d, keepCurrentOriginalModel: m = !1, keepCurrentModifiedModel: c = !1, theme: u = "light", loading: h = "Loading...", options: g = {}, height: A = "100%", width: L = "100%", className: _, wrapperProps: N = {}, beforeMount: O = ie, onMount: R = ie }) {
1900
+ let [j, I] = ue(!1), [S, b] = ue(!0), x = U(null), f = U(null), T = U(null), w = U(R), k = U(O), P = U(!1);
1901
+ Qe(() => {
1902
+ let E = Ke.init();
1903
+ return E.then((F) => (f.current = F) && b(!1)).catch((F) => F?.type !== "cancelation" && console.error("Monaco initialization: error:", F)), () => x.current ? M() : E.cancel();
1904
+ }), W(() => {
1905
+ if (x.current && f.current) {
1906
+ let E = x.current.getOriginalEditor(), F = Q(f.current, e || "", n || r || "text", o || "");
1907
+ F !== E.getModel() && E.setModel(F);
1908
+ }
1909
+ }, [o], j), W(() => {
1910
+ if (x.current && f.current) {
1911
+ let E = x.current.getModifiedEditor(), F = Q(f.current, i || "", s || r || "text", d || "");
1912
+ F !== E.getModel() && E.setModel(F);
1913
+ }
1914
+ }, [d], j), W(() => {
1915
+ let E = x.current.getModifiedEditor();
1916
+ E.getOption(f.current.editor.EditorOption.readOnly) ? E.setValue(i || "") : i !== E.getValue() && (E.executeEdits("", [{ range: E.getModel().getFullModelRange(), text: i || "", forceMoveMarkers: !0 }]), E.pushUndoStop());
1917
+ }, [i], j), W(() => {
1918
+ x.current?.getModel()?.original.setValue(e || "");
1919
+ }, [e], j), W(() => {
1920
+ let { original: E, modified: F } = x.current.getModel();
1921
+ f.current.editor.setModelLanguage(E, n || r || "text"), f.current.editor.setModelLanguage(F, s || r || "text");
1922
+ }, [r, n, s], j), W(() => {
1923
+ f.current?.editor.setTheme(u);
1924
+ }, [u], j), W(() => {
1925
+ x.current?.updateOptions(g);
1926
+ }, [g], j);
1927
+ let p = de(() => {
1928
+ if (!f.current) return;
1929
+ k.current(f.current);
1930
+ let E = Q(f.current, e || "", n || r || "text", o || ""), F = Q(f.current, i || "", s || r || "text", d || "");
1931
+ x.current?.setModel({ original: E, modified: F });
1932
+ }, [r, i, s, e, n, o, d]), C = de(() => {
1933
+ !P.current && T.current && (x.current = f.current.editor.createDiffEditor(T.current, { automaticLayout: !0, ...g }), p(), f.current?.editor.setTheme(u), I(!0), P.current = !0);
1934
+ }, [g, u, p]);
1935
+ J(() => {
1936
+ j && w.current(x.current, f.current);
1937
+ }, [j]), J(() => {
1938
+ !S && !j && C();
1939
+ }, [S, j, C]);
1940
+ function M() {
1941
+ let E = x.current?.getModel();
1942
+ m || E?.original?.dispose(), c || E?.modified?.dispose(), x.current?.dispose();
2346
1943
  }
2347
- return m.createElement(Dt, { width: A, height: P, isEditorReady: j, loading: v, _ref: D, className: z, wrapperProps: E });
2348
- }
2349
- var rs = ts;
2350
- Ge(rs);
2351
- function ns(e) {
2352
- let r = Q();
2353
- return le(() => {
2354
- r.current = e;
2355
- }, [e]), r.current;
2356
- }
2357
- var ss = ns, Re = /* @__PURE__ */ new Map();
2358
- function as({ defaultValue: e, defaultLanguage: r, defaultPath: n, value: a, language: o, path: i, theme: h = "light", line: l, loading: u = "Loading...", options: p = {}, overrideServices: v = {}, saveViewState: x = !0, keepCurrentModel: P = !1, width: A = "100%", height: z = "100%", className: E, wrapperProps: F = {}, beforeMount: R = xe, onMount: j = xe, onChange: L, onValidate: I = xe }) {
2359
- let [f, C] = Pe(!1), [g, D] = Pe(!0), T = Q(null), N = Q(null), V = Q(null), H = Q(j), G = Q(R), B = Q(), c = Q(a), w = ss(i), S = Q(!1), X = Q(!1);
2360
- Lt(() => {
2361
- let y = Ft.init();
2362
- return y.then((_) => (T.current = _) && D(!1)).catch((_) => (_ == null ? void 0 : _.type) !== "cancelation" && console.error("Monaco initialization: error:", _)), () => N.current ? Z() : y.cancel();
2363
- }), ne(() => {
2364
- var _, Y, oe, te;
2365
- let y = he(T.current, e || a || "", r || o || "", i || n || "");
2366
- y !== ((_ = N.current) == null ? void 0 : _.getModel()) && (x && Re.set(w, (Y = N.current) == null ? void 0 : Y.saveViewState()), (oe = N.current) == null || oe.setModel(y), x && ((te = N.current) == null || te.restoreViewState(Re.get(i))));
2367
- }, [i], f), ne(() => {
2368
- var y;
2369
- (y = N.current) == null || y.updateOptions(p);
2370
- }, [p], f), ne(() => {
2371
- !N.current || a === void 0 || (N.current.getOption(T.current.editor.EditorOption.readOnly) ? N.current.setValue(a) : a !== N.current.getValue() && (X.current = !0, N.current.executeEdits("", [{ range: N.current.getModel().getFullModelRange(), text: a, forceMoveMarkers: !0 }]), N.current.pushUndoStop(), X.current = !1));
2372
- }, [a], f), ne(() => {
2373
- var _, Y;
2374
- let y = (_ = N.current) == null ? void 0 : _.getModel();
2375
- y && o && ((Y = T.current) == null || Y.editor.setModelLanguage(y, o));
2376
- }, [o], f), ne(() => {
2377
- var y;
2378
- l !== void 0 && ((y = N.current) == null || y.revealLine(l));
2379
- }, [l], f), ne(() => {
2380
- var y;
2381
- (y = T.current) == null || y.editor.setTheme(h);
2382
- }, [h], f);
2383
- let W = ke(() => {
2384
- var y;
2385
- if (!(!V.current || !T.current) && !S.current) {
2386
- G.current(T.current);
2387
- let _ = i || n, Y = he(T.current, a || e || "", r || o || "", _ || "");
2388
- N.current = (y = T.current) == null ? void 0 : y.editor.create(V.current, { model: Y, automaticLayout: !0, ...p }, v), x && N.current.restoreViewState(Re.get(_)), T.current.editor.setTheme(h), l !== void 0 && N.current.revealLine(l), C(!0), S.current = !0;
2389
- }
2390
- }, [e, r, n, a, o, i, p, v, x, h, l]);
2391
- le(() => {
2392
- f && H.current(N.current, T.current);
2393
- }, [f]), le(() => {
2394
- !g && !f && W();
2395
- }, [g, f, W]), c.current = a, le(() => {
2396
- var y, _;
2397
- f && L && ((y = B.current) == null || y.dispose(), B.current = (_ = N.current) == null ? void 0 : _.onDidChangeModelContent((Y) => {
2398
- X.current || L(N.current.getValue(), Y);
1944
+ return l.createElement(Xe, { width: L, height: A, isEditorReady: j, loading: h, _ref: T, className: _, wrapperProps: N });
1945
+ }
1946
+ var Yi = Hi;
1947
+ Ce(Yi);
1948
+ function Ji(e) {
1949
+ let i = U();
1950
+ return J(() => {
1951
+ i.current = e;
1952
+ }, [e]), i.current;
1953
+ }
1954
+ var Bi = Ji, ce = /* @__PURE__ */ new Map();
1955
+ function Gi({ defaultValue: e, defaultLanguage: i, defaultPath: r, value: n, language: s, path: o, theme: d = "light", line: m, loading: c = "Loading...", options: u = {}, overrideServices: h = {}, saveViewState: g = !0, keepCurrentModel: A = !1, width: L = "100%", height: _ = "100%", className: N, wrapperProps: O = {}, beforeMount: R = ie, onMount: j = ie, onChange: I, onValidate: S = ie }) {
1956
+ let [b, x] = ue(!1), [f, T] = ue(!0), w = U(null), k = U(null), P = U(null), p = U(j), C = U(R), M = U(), E = U(n), F = Bi(o), $ = U(!1), z = U(!1);
1957
+ Qe(() => {
1958
+ let a = Ke.init();
1959
+ return a.then((v) => (w.current = v) && T(!1)).catch((v) => v?.type !== "cancelation" && console.error("Monaco initialization: error:", v)), () => k.current ? Y() : a.cancel();
1960
+ }), W(() => {
1961
+ let a = Q(w.current, e || n || "", i || s || "", o || r || "");
1962
+ a !== k.current?.getModel() && (g && ce.set(F, k.current?.saveViewState()), k.current?.setModel(a), g && k.current?.restoreViewState(ce.get(o)));
1963
+ }, [o], b), W(() => {
1964
+ k.current?.updateOptions(u);
1965
+ }, [u], b), W(() => {
1966
+ !k.current || n === void 0 || (k.current.getOption(w.current.editor.EditorOption.readOnly) ? k.current.setValue(n) : n !== k.current.getValue() && (z.current = !0, k.current.executeEdits("", [{ range: k.current.getModel().getFullModelRange(), text: n, forceMoveMarkers: !0 }]), k.current.pushUndoStop(), z.current = !1));
1967
+ }, [n], b), W(() => {
1968
+ let a = k.current?.getModel();
1969
+ a && s && w.current?.editor.setModelLanguage(a, s);
1970
+ }, [s], b), W(() => {
1971
+ m !== void 0 && k.current?.revealLine(m);
1972
+ }, [m], b), W(() => {
1973
+ w.current?.editor.setTheme(d);
1974
+ }, [d], b);
1975
+ let H = de(() => {
1976
+ if (!(!P.current || !w.current) && !$.current) {
1977
+ C.current(w.current);
1978
+ let a = o || r, v = Q(w.current, n || e || "", i || s || "", a || "");
1979
+ k.current = w.current?.editor.create(P.current, { model: v, automaticLayout: !0, ...u }, h), g && k.current.restoreViewState(ce.get(a)), w.current.editor.setTheme(d), m !== void 0 && k.current.revealLine(m), x(!0), $.current = !0;
1980
+ }
1981
+ }, [e, i, r, n, s, o, u, h, g, d, m]);
1982
+ J(() => {
1983
+ b && p.current(k.current, w.current);
1984
+ }, [b]), J(() => {
1985
+ !f && !b && H();
1986
+ }, [f, b, H]), E.current = n, J(() => {
1987
+ b && I && (M.current?.dispose(), M.current = k.current?.onDidChangeModelContent((a) => {
1988
+ z.current || I(k.current.getValue(), a);
2399
1989
  }));
2400
- }, [f, L]), le(() => {
2401
- if (f) {
2402
- let y = T.current.editor.onDidChangeMarkers((_) => {
2403
- var oe;
2404
- let Y = (oe = N.current.getModel()) == null ? void 0 : oe.uri;
2405
- if (Y && _.find((te) => te.path === Y.path)) {
2406
- let te = T.current.editor.getModelMarkers({ resource: Y });
2407
- I == null || I(te);
1990
+ }, [b, I]), J(() => {
1991
+ if (b) {
1992
+ let a = w.current.editor.onDidChangeMarkers((v) => {
1993
+ let y = k.current.getModel()?.uri;
1994
+ if (y && v.find((D) => D.path === y.path)) {
1995
+ let D = w.current.editor.getModelMarkers({ resource: y });
1996
+ S?.(D);
2408
1997
  }
2409
1998
  });
2410
1999
  return () => {
2411
- y == null || y.dispose();
2000
+ a?.dispose();
2412
2001
  };
2413
2002
  }
2414
2003
  return () => {
2415
2004
  };
2416
- }, [f, I]);
2417
- function Z() {
2418
- var y, _;
2419
- (y = B.current) == null || y.dispose(), P ? x && Re.set(i, N.current.saveViewState()) : (_ = N.current.getModel()) == null || _.dispose(), N.current.dispose();
2005
+ }, [b, S]);
2006
+ function Y() {
2007
+ M.current?.dispose(), A ? g && ce.set(o, k.current.saveViewState()) : k.current.getModel()?.dispose(), k.current.dispose();
2420
2008
  }
2421
- return m.createElement(Dt, { width: A, height: z, isEditorReady: f, loading: u, _ref: V, className: E, wrapperProps: F });
2422
- }
2423
- var os = as, ls = Ge(os), is = ls;
2424
- function cs() {
2425
- const e = Ot(), r = ae((f) => f.replaceAll), n = ie(), { showAlert: a } = Tt(), o = m.useRef(null), i = m.useRef(""), h = m.useRef(null), l = m.useRef(!1), [u, p] = m.useState("yaml"), [v, x] = m.useState(640), [P, A] = m.useState(() => {
2009
+ return l.createElement(Xe, { width: L, height: _, isEditorReady: b, loading: c, _ref: P, className: N, wrapperProps: O });
2010
+ }
2011
+ var Ki = Gi, Xi = Ce(Ki), Qi = Xi;
2012
+ function Zi() {
2013
+ const e = $e(), i = V((f) => f.replaceAll), r = B(), { showAlert: n } = Ue(), s = l.useRef(null), o = l.useRef(""), d = l.useRef(null), m = l.useRef(!1), [c, u] = l.useState("yaml"), [h, g] = l.useState(!1);
2014
+ l.useEffect(() => {
2015
+ const f = document.querySelector(".qb-editor-root");
2016
+ if (!f) return;
2017
+ const T = () => {
2018
+ g(f.classList.contains("dark"));
2019
+ };
2020
+ T();
2021
+ const w = new MutationObserver(T);
2022
+ return w.observe(f, { attributes: !0, attributeFilter: ["class"] }), () => w.disconnect();
2023
+ }, []);
2024
+ const [A, L] = l.useState(640), [_, N] = l.useState(() => {
2426
2025
  try {
2427
- return Te.dump(e, { indent: 2, lineWidth: -1 });
2026
+ return ae.dump(e, { indent: 2, lineWidth: -1 });
2428
2027
  } catch {
2429
2028
  return "";
2430
2029
  }
2431
- }), [z, E] = m.useState("");
2432
- m.useEffect(() => {
2433
- n.setCodeEditorHasError(!1);
2030
+ }), [O, R] = l.useState("");
2031
+ l.useEffect(() => {
2032
+ r.setCodeEditorHasError(!1);
2434
2033
  }, []);
2435
- const F = m.useCallback((f) => u === "json" ? JSON.parse(f) : Te.load(f), [u]), R = m.useCallback((f) => u === "json" ? JSON.stringify(f, null, 2) : Te.dump(f, { indent: 2, lineWidth: -1 }), [u]);
2436
- m.useEffect(() => {
2034
+ const j = l.useCallback((f) => c === "json" ? JSON.parse(f) : ae.load(f), [c]), I = l.useCallback((f) => c === "json" ? JSON.stringify(f, null, 2) : ae.dump(f, { indent: 2, lineWidth: -1 }), [c]);
2035
+ l.useEffect(() => {
2437
2036
  const f = () => {
2438
- if (o.current) {
2439
- const C = o.current.getBoundingClientRect().top, g = window.innerHeight - C - 20;
2440
- x(Math.max(400, g));
2037
+ if (s.current) {
2038
+ const T = s.current.getBoundingClientRect().top, w = window.innerHeight - T - 20;
2039
+ L(Math.max(400, w));
2441
2040
  }
2442
2041
  };
2443
2042
  return f(), window.addEventListener("resize", f), () => window.removeEventListener("resize", f);
2444
- }, []), m.useEffect(() => {
2445
- if (!l.current)
2043
+ }, []), l.useEffect(() => {
2044
+ if (!m.current)
2446
2045
  try {
2447
- const f = R(e);
2448
- A(f), i.current = f, E(""), n.setCodeEditorHasError(!1);
2046
+ const f = I(e);
2047
+ N(f), o.current = f, R(""), r.setCodeEditorHasError(!1);
2449
2048
  } catch (f) {
2450
- E(`Failed to serialize: ${f.message}`), n.setCodeEditorHasError(!0);
2049
+ R(`Failed to serialize: ${f.message}`), r.setCodeEditorHasError(!0);
2451
2050
  }
2452
- }, [e, R, n]);
2453
- const j = (f) => {
2454
- A(f || ""), i.current = f || "", l.current = !0;
2051
+ }, [e, I, r]);
2052
+ const S = (f) => {
2053
+ N(f || ""), o.current = f || "", m.current = !0;
2455
2054
  try {
2456
- const C = F(f || "{}");
2457
- if (!C || typeof C != "object")
2055
+ const T = j(f || "{}");
2056
+ if (!T || typeof T != "object")
2458
2057
  throw new Error("Invalid form data: must be an object");
2459
- E(""), n.setCodeEditorHasError(!1);
2460
- } catch (C) {
2461
- const g = `Invalid ${u.toUpperCase()}: ${C.message}`;
2462
- E(g), n.setCodeEditorHasError(!0);
2463
- }
2464
- }, L = (f) => {
2465
- h.current = f, f.onDidPaste((C) => {
2466
- const g = P, D = f.getModel().getValue();
2058
+ R(""), r.setCodeEditorHasError(!1);
2059
+ } catch (T) {
2060
+ const w = `Invalid ${c.toUpperCase()}: ${T.message}`;
2061
+ R(w), r.setCodeEditorHasError(!0);
2062
+ }
2063
+ }, b = (f) => {
2064
+ d.current = f, f.onDidPaste((T) => {
2065
+ const w = _, k = f.getModel().getValue();
2467
2066
  try {
2468
- const T = F(D);
2469
- if (T && typeof T == "object") {
2470
- const { schemaType: N } = Ae(T);
2471
- N === "surveyjs" && a(
2067
+ const P = j(k);
2068
+ if (P && typeof P == "object") {
2069
+ const { schemaType: p } = fe(P);
2070
+ p === "surveyjs" && n(
2472
2071
  `This SurveyJS schema will be converted to MIE Forms format.
2473
2072
 
2474
2073
  Do you want to proceed with the conversion?`,
@@ -2477,21 +2076,20 @@ Do you want to proceed with the conversion?`,
2477
2076
  confirmText: "Yes, Convert",
2478
2077
  cancelText: "No, Cancel Paste",
2479
2078
  onConfirm: () => {
2480
- const { fields: V, conversionReport: H } = _e(T, N), G = {
2481
- schemaType: T.schemaType || ze,
2482
- ...(H == null ? void 0 : H.surveyMetadata) || {},
2483
- fields: V
2079
+ const { fields: C, conversionReport: M } = pe(P, p), E = {
2080
+ schemaType: P.schemaType || ve,
2081
+ ...M?.surveyMetadata || {},
2082
+ fields: C
2484
2083
  };
2485
- r(G);
2486
- const B = R(G);
2487
- A(B), i.current = B, f.setValue(B), E(""), l.current = !1, H && (n.setConversionReport(H), setTimeout(() => {
2488
- var w;
2489
- const c = ((w = H == null ? void 0 : H.unsupportedFields) == null ? void 0 : w.length) || 0;
2490
- a(
2084
+ i(E);
2085
+ const F = I(E);
2086
+ N(F), o.current = F, f.setValue(F), R(""), m.current = !1, M && (r.setConversionReport(M), setTimeout(() => {
2087
+ const $ = M?.unsupportedFields?.length || 0;
2088
+ n(
2491
2089
  `This schema has been converted to MIE Forms format.
2492
2090
 
2493
- Converted: ${(H == null ? void 0 : H.convertedFields) || 0} field(s)
2494
- Unsupported: ${c} field(s)${c > 0 ? " ⚠️" : ""}
2091
+ Converted: ${M?.convertedFields || 0} field(s)
2092
+ Unsupported: ${$} field(s)${$ > 0 ? " ⚠️" : ""}
2495
2093
 
2496
2094
  Please use MIE Forms schema inside of code editor for the best experience in the future.`,
2497
2095
  { title: "ℹ️ SurveyJS Schema Detected" }
@@ -2499,7 +2097,7 @@ Please use MIE Forms schema inside of code editor for the best experience in the
2499
2097
  }, 100));
2500
2098
  },
2501
2099
  onCancel: () => {
2502
- f.setValue(g), A(g), i.current = g;
2100
+ f.setValue(w), N(w), o.current = w;
2503
2101
  }
2504
2102
  }
2505
2103
  );
@@ -2507,66 +2105,65 @@ Please use MIE Forms schema inside of code editor for the best experience in the
2507
2105
  } catch {
2508
2106
  }
2509
2107
  });
2510
- }, I = (f) => {
2108
+ }, x = (f) => {
2511
2109
  try {
2512
- const C = F(P), g = f === "json" ? JSON.stringify(C, null, 2) : Te.dump(C, { indent: 2, lineWidth: -1 });
2513
- A(g), i.current = g, p(f), E(""), n.setCodeEditorHasError(!1);
2514
- } catch (C) {
2515
- E(`Cannot convert: ${C.message}`), n.setCodeEditorHasError(!0);
2110
+ const T = j(_), w = f === "json" ? JSON.stringify(T, null, 2) : ae.dump(T, { indent: 2, lineWidth: -1 });
2111
+ N(w), o.current = w, u(f), R(""), r.setCodeEditorHasError(!1);
2112
+ } catch (T) {
2113
+ R(`Cannot convert: ${T.message}`), r.setCodeEditorHasError(!0);
2516
2114
  }
2517
2115
  };
2518
- return m.useEffect(() => () => {
2519
- var C;
2520
- const f = (C = i.current) == null ? void 0 : C.trim();
2116
+ return l.useEffect(() => () => {
2117
+ const f = o.current?.trim();
2521
2118
  if (!f) {
2522
- r({ schemaType: ze, fields: [] }), l.current = !1;
2119
+ i({ schemaType: ve, fields: [] }), m.current = !1;
2523
2120
  return;
2524
2121
  }
2525
2122
  try {
2526
- const g = F(f);
2527
- if (!g || typeof g != "object" || JSON.stringify(e) === JSON.stringify(g)) return;
2528
- const { schemaType: D } = Ae(g), { fields: T, conversionReport: N } = _e(g, D), V = {
2529
- schemaType: g.schemaType || ze,
2530
- ...(N == null ? void 0 : N.surveyMetadata) || {},
2531
- fields: T
2123
+ const T = j(f);
2124
+ if (!T || typeof T != "object" || JSON.stringify(e) === JSON.stringify(T)) return;
2125
+ const { schemaType: w } = fe(T), { fields: k, conversionReport: P } = pe(T, w), p = {
2126
+ schemaType: T.schemaType || ve,
2127
+ ...P?.surveyMetadata || {},
2128
+ fields: k
2532
2129
  };
2533
- N && n.setConversionReport(N), r(V), n.setCodeEditorHasError(!1), l.current = !1;
2130
+ P && r.setConversionReport(P), i(p), r.setCodeEditorHasError(!1), m.current = !1;
2534
2131
  } catch {
2535
2132
  }
2536
- }, [F, r, n, e]), /* @__PURE__ */ t.jsxs("div", { ref: o, className: "code-editor-container flex flex-col bg-gray-50 max-w-7xl w-full", style: { height: `${v}px` }, children: [
2537
- /* @__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: [
2538
- /* @__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: [
2133
+ }, [j, i, r, e]), /* @__PURE__ */ t.jsxs("div", { ref: s, className: "code-editor-container mie:flex mie:flex-col mie:bg-miebackground mie:max-w-7xl mie:w-full", style: { height: `${A}px` }, children: [
2134
+ /* @__PURE__ */ t.jsxs("div", { className: "code-editor-header mie:flex mie:items-center mie:justify-between mie:gap-3 mie:p-4 mie:bg-miesurface mie:border-b mie:border-mieborder", children: [
2135
+ /* @__PURE__ */ t.jsx("div", { className: "mie:flex mie:items-center mie:gap-2", children: /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:gap-1 mie:rounded-lg mie:border mie:border-mieborder mie:bg-miebackground mie:p-1", children: [
2539
2136
  /* @__PURE__ */ t.jsx(
2540
2137
  "button",
2541
2138
  {
2542
- onClick: () => I("yaml"),
2543
- className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${u === "yaml" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
2139
+ onClick: () => x("yaml"),
2140
+ className: `mie:px-3 mie:py-1 mie:rounded-md mie:text-sm mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${c === "yaml" ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
2544
2141
  children: "YAML"
2545
2142
  }
2546
2143
  ),
2547
2144
  /* @__PURE__ */ t.jsx(
2548
2145
  "button",
2549
2146
  {
2550
- onClick: () => I("json"),
2551
- className: `px-3 py-1 rounded-md text-sm font-medium transition-colors ${u === "json" ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"}`,
2147
+ onClick: () => x("json"),
2148
+ className: `mie:px-3 mie:py-1 mie:rounded-md mie:text-sm mie:font-medium mie:transition-colors mie:border-0 mie:outline-none mie:focus:outline-none ${c === "json" ? "mie:bg-mieprimary mie:text-mietextsecondary mie:shadow-sm" : "mie:bg-transparent mie:text-mietextmuted mie:hover:text-mietext mie:hover:bg-miesurface"}`,
2552
2149
  children: "JSON"
2553
2150
  }
2554
2151
  )
2555
2152
  ] }) }),
2556
- /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
2557
- /* @__PURE__ */ t.jsx("div", { className: "text-xs text-gray-500 px-3 py-1", children: "Auto-saves when switching tabs" }),
2558
- z && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-red-600 bg-red-50 px-3 py-1 rounded-lg", children: z })
2153
+ /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:gap-2", children: [
2154
+ /* @__PURE__ */ t.jsx("div", { className: "mie:text-xs mie:text-mietextmuted mie:px-3 mie:py-1", children: "Auto-saves when switching tabs" }),
2155
+ O && /* @__PURE__ */ t.jsx("div", { className: "mie:text-xs mie:text-miedanger mie:bg-miedanger/10 mie:px-3 mie:py-1 mie:rounded-lg", children: O })
2559
2156
  ] })
2560
2157
  ] }),
2561
- /* @__PURE__ */ t.jsx("div", { className: "code-editor-content flex-1 overflow-hidden", children: /* @__PURE__ */ t.jsx(
2562
- is,
2158
+ /* @__PURE__ */ t.jsx("div", { className: "code-editor-content mie:flex-1 mie:overflow-hidden", children: /* @__PURE__ */ t.jsx(
2159
+ Qi,
2563
2160
  {
2564
2161
  height: "100%",
2565
- language: u,
2566
- value: P,
2567
- onChange: j,
2568
- onMount: L,
2569
- theme: "light",
2162
+ language: c,
2163
+ value: _,
2164
+ onChange: S,
2165
+ onMount: b,
2166
+ theme: h ? "vs-dark" : "light",
2570
2167
  options: {
2571
2168
  minimap: { enabled: !1 },
2572
2169
  fontSize: 13,
@@ -2584,106 +2181,116 @@ Please use MIE Forms schema inside of code editor for the best experience in the
2584
2181
  ) })
2585
2182
  ] });
2586
2183
  }
2587
- function us({ selectedField: e }) {
2588
- const r = ie(), [n, a] = m.useState(!1), o = r.state.isPreview, i = r.state.isCodeEditor, h = r.state.isEditModalOpen, l = r.state.panelResetKey, u = !o;
2589
- return /* @__PURE__ */ t.jsxs("div", { className: "layout-container w-full h-fit rounded-lg mt-2 md:mt-4 lg:mt-6", children: [
2590
- i ? /* @__PURE__ */ t.jsx("div", { className: "border border-gray-200 rounded-lg", children: /* @__PURE__ */ t.jsx(cs, {}) }) : /* @__PURE__ */ t.jsxs("div", { className: "layout-grid flex lg:gap-3 h-full", children: [
2591
- u && /* @__PURE__ */ t.jsx("div", { className: "layout-tool-panel hidden lg:block lg:w-72", children: /* @__PURE__ */ t.jsx(gt, {}) }),
2592
- /* @__PURE__ */ t.jsx("div", { className: "layout-main-content flex-1 min-w-0", children: /* @__PURE__ */ t.jsx(Gr, {}) }),
2593
- u && /* @__PURE__ */ t.jsx("div", { className: "layout-edit-panel hidden lg:block lg:w-90 md:w-80", children: /* @__PURE__ */ t.jsx(xt, {}, l) }),
2594
- u && /* @__PURE__ */ t.jsx("div", { className: "layout-mobile-modal lg:hidden", children: h && e && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2184
+ function er({ selectedField: e }) {
2185
+ const i = B(), [r, n] = l.useState(!1), s = i.state.isPreview, o = i.state.isCodeEditor, d = i.state.isEditModalOpen, m = i.state.panelResetKey, c = !s;
2186
+ return /* @__PURE__ */ t.jsxs("div", { className: "layout-container mie:w-full mie:h-fit mie:rounded-lg mie:mt-3", children: [
2187
+ o ? /* @__PURE__ */ t.jsx("div", { className: "mie:border mie:border-mieborder mie:rounded-lg", children: /* @__PURE__ */ t.jsx(Zi, {}) }) : /* @__PURE__ */ t.jsxs("div", { className: "layout-grid mie:flex mie:lg:gap-3 mie:h-full", children: [
2188
+ c && /* @__PURE__ */ t.jsx("div", { className: "layout-tool-panel mie:hidden mie:lg:block mie:lg:w-72", children: /* @__PURE__ */ t.jsx(ke, {}) }),
2189
+ /* @__PURE__ */ t.jsx("div", { className: "layout-main-content mie:flex-1 mie:min-w-0", children: /* @__PURE__ */ t.jsx(Ut, {}) }),
2190
+ c && /* @__PURE__ */ t.jsx("div", { className: "layout-edit-panel mie:hidden mie:lg:block mie:lg:w-90 mie:md:w-80", children: /* @__PURE__ */ t.jsx(Pe, {}, m) }),
2191
+ c && /* @__PURE__ */ t.jsx("div", { className: "layout-mobile-modal mie:lg:hidden", children: d && e && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2595
2192
  /* @__PURE__ */ t.jsx(
2596
2193
  "div",
2597
2194
  {
2598
- className: "fixed inset-0 z-40 bg-black/30 lg:hidden",
2599
- onClick: () => r.modal.set(!1)
2195
+ className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-mieoverlay mie:lg:hidden",
2196
+ onClick: () => i.modal.set(!1)
2600
2197
  }
2601
2198
  ),
2602
- /* @__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(xt, {}, l) }) })
2199
+ /* @__PURE__ */ t.jsx("div", { className: "mie:fixed mie:bottom-0 mie:left-0 mie:right-0 mie:z-50 mie:bg-miesurface mie:rounded-t-2xl mie:shadow-2xl mie:max-h-[60vh] mie:overflow-y-auto mie:custom-scrollbar mie:lg:hidden", children: /* @__PURE__ */ t.jsx(Pe, { isMobileModal: !0 }, m) })
2603
2200
  ] }) })
2604
2201
  ] }),
2605
- u && !i && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2202
+ c && !o && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2606
2203
  /* @__PURE__ */ t.jsx(
2607
2204
  "button",
2608
2205
  {
2609
- onClick: () => a(!n),
2610
- 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",
2206
+ onClick: () => n(!r),
2207
+ className: "mie:lg:hidden mie:fixed mie:bottom-5 mie:left-5 mie:z-40 mie:bg-mieprimary mie:hover:bg-mieprimary/90 mie:text-miesurface mie:rounded-full mie:w-12 mie:h-12 mie:flex mie:items-center mie:justify-center mie:shadow-lg mie:transition-all",
2611
2208
  title: "Add field",
2612
- 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" }) })
2209
+ children: /* @__PURE__ */ t.jsx("svg", { className: "mie:w-6 mie: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" }) })
2613
2210
  }
2614
2211
  ),
2615
- n && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2212
+ r && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2616
2213
  /* @__PURE__ */ t.jsx(
2617
2214
  "div",
2618
2215
  {
2619
- className: "fixed inset-0 z-40 bg-black/30 lg:hidden",
2620
- onClick: () => a(!1)
2216
+ className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-mieoverlay mie:lg:hidden",
2217
+ onClick: () => n(!1)
2621
2218
  }
2622
2219
  ),
2623
- /* @__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(gt, {}) })
2220
+ /* @__PURE__ */ t.jsx("div", { className: "mie:fixed mie:bottom-0 mie:left-0 mie:right-0 mie:z-50 mie:bg-miesurface mie:rounded-t-2xl mie:shadow-2xl mie:max-h-[60vh] mie:overflow-y-auto mie:custom-scrollbar mie:lg:hidden", children: /* @__PURE__ */ t.jsx(ke, {}) })
2624
2221
  ] })
2625
2222
  ] })
2626
2223
  ] });
2627
2224
  }
2628
- function ds({
2225
+ function tr({
2629
2226
  initialFormData: e,
2630
- schemaType: r,
2631
- onChange: n,
2632
- className: a = "",
2633
- showHeader: o = !0,
2634
- startInPreview: i = !1,
2635
- hideUnsupportedFields: h = !1
2227
+ schemaType: i,
2228
+ onChange: r,
2229
+ className: n = "",
2230
+ showHeader: s = !0,
2231
+ startInPreview: o = !1,
2232
+ hideUnsupportedFields: d = !1,
2233
+ theme: m = "auto"
2636
2234
  }) {
2637
- const [l, u] = m.useState("json"), p = ie(), v = m.useRef(!1), x = m.useContext(Xe);
2638
- m.useEffect(() => {
2639
- var A;
2640
- if (!(v.current || !x)) {
2235
+ const [c, u] = l.useState("json"), h = B(), g = l.useRef(!1), A = l.useContext(Oe);
2236
+ l.useEffect(() => {
2237
+ if (!(g.current || !A)) {
2641
2238
  if (e)
2642
2239
  try {
2643
- const { data: z, schemaType: E } = Ae(e, r), F = _e(z, E);
2644
- F.conversionReport && p.setConversionReport(F.conversionReport);
2645
- const R = {
2646
- schemaType: E === "surveyjs" ? "mieforms-v1.0" : z.schemaType || "mieforms-v1.0",
2647
- fields: F.fields || []
2240
+ const { data: O, schemaType: R } = fe(e, i), j = pe(O, R);
2241
+ j.conversionReport && h.setConversionReport(j.conversionReport);
2242
+ const I = {
2243
+ schemaType: R === "surveyjs" ? "mieforms-v1.0" : O.schemaType || "mieforms-v1.0",
2244
+ fields: j.fields || []
2648
2245
  };
2649
- if (E === "surveyjs" && ((A = F.conversionReport) != null && A.surveyMetadata))
2650
- Object.assign(R, F.conversionReport.surveyMetadata);
2651
- else if (E === "mieforms") {
2652
- const { fields: j, schemaType: L, ...I } = z;
2653
- Object.keys(I).length > 0 && Object.assign(R, I);
2246
+ if (R === "surveyjs" && j.conversionReport?.surveyMetadata)
2247
+ Object.assign(I, j.conversionReport.surveyMetadata);
2248
+ else if (R === "mieforms") {
2249
+ const { fields: S, schemaType: b, ...x } = O;
2250
+ Object.keys(x).length > 0 && Object.assign(I, x);
2654
2251
  }
2655
- Array.isArray(R.fields) && R.fields.length && x.getState().replaceAll(R);
2252
+ Array.isArray(I.fields) && I.fields.length && A.getState().replaceAll(I);
2656
2253
  } catch {
2657
- x.getState().replaceAll({ schemaType: "mieforms-v1.0", fields: [] });
2254
+ A.getState().replaceAll({ schemaType: "mieforms-v1.0", fields: [] });
2658
2255
  }
2659
- p.preview.set(!!i), v.current = !0;
2660
- }
2661
- }, [e, r, i, p, x]), m.useEffect(() => {
2662
- p.setHideUnsupportedFields(h);
2663
- }, [h, p]), m.useEffect(() => {
2664
- if (!(!n || !x))
2665
- return x.subscribe((A) => {
2666
- n({
2667
- schemaType: A.schemaType || "mieforms-v1.0",
2668
- ...A.schemaMetadata,
2669
- fields: A.order.map((z) => A.byId[z])
2256
+ h.preview.set(!!o), g.current = !0;
2257
+ }
2258
+ }, [e, i, o, h, A]), l.useEffect(() => {
2259
+ h.setHideUnsupportedFields(d);
2260
+ }, [d, h]), l.useEffect(() => {
2261
+ if (!(!r || !A))
2262
+ return A.subscribe((O) => {
2263
+ r({
2264
+ schemaType: O.schemaType || "mieforms-v1.0",
2265
+ ...O.schemaMetadata,
2266
+ fields: O.order.map((R) => O.byId[R])
2670
2267
  });
2671
2268
  });
2672
- }, [n, x]);
2673
- const P = Mr(
2674
- x,
2675
- (A) => p.selectedFieldId.value ? A.byId[p.selectedFieldId.value] : null
2676
- );
2677
- return /* @__PURE__ */ t.jsxs("div", { className: `qb-editor-root editor-container w-full max-w-7xl mx-auto bg-gray-100 font-titillium ${a}`, children: [
2678
- o && /* @__PURE__ */ t.jsx($r, { codeFormat: l, onCodeFormatChange: u }),
2679
- /* @__PURE__ */ t.jsx(us, { selectedField: P, codeFormat: l })
2680
- ] });
2269
+ }, [r, A]);
2270
+ const L = Ot(
2271
+ A,
2272
+ (O) => h.selectedFieldId.value ? O.byId[h.selectedFieldId.value] : null
2273
+ ), [_, N] = l.useState(() => m === "dark" ? !0 : m === "light" ? !1 : typeof document < "u" ? document.documentElement.getAttribute("data-theme") === "dark" || document.documentElement.classList.contains("dark") || document.body.classList.contains("dark") : !1);
2274
+ return l.useEffect(() => {
2275
+ if (m !== "auto") {
2276
+ N(m === "dark");
2277
+ return;
2278
+ }
2279
+ const O = new MutationObserver(() => {
2280
+ const R = document.documentElement.getAttribute("data-theme") === "dark" || document.documentElement.classList.contains("dark") || document.body.classList.contains("dark");
2281
+ N(R);
2282
+ });
2283
+ return O.observe(document.documentElement, { attributes: !0, attributeFilter: ["data-theme", "class"] }), O.observe(document.body, { attributes: !0, attributeFilter: ["class"] }), () => O.disconnect();
2284
+ }, [m]), /* @__PURE__ */ t.jsx("div", { className: `qb-editor-root editor-container mie:w-full mie:max-w-7xl mie:mx-auto mie:bg-miebackground mie:font-titillium ${_ ? "dark" : ""} ${n}`, children: /* @__PURE__ */ t.jsxs(Ct, { children: [
2285
+ s && /* @__PURE__ */ t.jsx(kt, { codeFormat: c, onCodeFormatChange: u }),
2286
+ /* @__PURE__ */ t.jsx(er, { selectedField: L, codeFormat: c })
2287
+ ] }) });
2681
2288
  }
2682
- function gs(e) {
2683
- const r = m.useRef(kr()).current, n = m.useRef(Pr()).current;
2684
- return /* @__PURE__ */ t.jsx(Ar, { children: /* @__PURE__ */ t.jsx(Xe.Provider, { value: r, children: /* @__PURE__ */ t.jsx(_r.Provider, { value: n, children: /* @__PURE__ */ t.jsx(ds, { ...e }) }) }) });
2289
+ function or(e) {
2290
+ const i = l.useRef(wt()).current, r = l.useRef(Et()).current;
2291
+ return /* @__PURE__ */ t.jsx(Oe.Provider, { value: i, children: /* @__PURE__ */ t.jsx(Nt.Provider, { value: r, children: /* @__PURE__ */ t.jsx(tr, { ...e }) }) });
2685
2292
  }
2686
2293
  export {
2687
- gs as QuestionnaireEditor
2294
+ or as QuestionnaireEditor
2688
2295
  };
2689
2296
  //# sourceMappingURL=index.js.map