@mieweb/forms-editor 1.2.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 +972 -953
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -5,32 +5,32 @@
|
|
|
5
5
|
if (!document.querySelector('#questionnaire-editor-styles')) {
|
|
6
6
|
const style = document.createElement('style');
|
|
7
7
|
style.id = 'questionnaire-editor-styles';
|
|
8
|
-
style.textContent = "/*! tailwindcss v4.1.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-red-50: oklch(97.1% 0.013 17.38);\n --mie-color-red-100: oklch(93.6% 0.032 17.717);\n --mie-color-red-200: oklch(88.5% 0.062 18.334);\n --mie-color-red-300: oklch(80.8% 0.114 19.571);\n --mie-color-red-600: oklch(57.7% 0.245 27.325);\n --mie-color-red-700: oklch(50.5% 0.213 27.518);\n --mie-color-orange-50: oklch(98% 0.016 73.684);\n --mie-color-orange-500: oklch(70.5% 0.213 47.604);\n --mie-color-orange-600: oklch(64.6% 0.222 41.116);\n --mie-color-orange-700: oklch(55.3% 0.195 38.402);\n --mie-color-blue-50: oklch(97% 0.014 254.604);\n --mie-color-blue-100: oklch(93.2% 0.032 255.585);\n --mie-color-blue-200: oklch(88.2% 0.059 254.128);\n --mie-color-blue-300: oklch(80.9% 0.105 251.813);\n --mie-color-blue-400: oklch(70.7% 0.165 254.624);\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-blue-700: oklch(48.8% 0.243 264.376);\n --mie-color-blue-800: oklch(42.4% 0.199 265.638);\n --mie-color-blue-900: oklch(37.9% 0.146 265.522);\n --mie-color-slate-50: oklch(98.4% 0.003 247.858);\n --mie-color-slate-200: oklch(92.9% 0.013 255.508);\n --mie-color-slate-300: oklch(86.9% 0.022 252.894);\n --mie-color-slate-400: oklch(70.4% 0.04 256.788);\n --mie-color-slate-500: oklch(55.4% 0.046 257.417);\n --mie-color-slate-600: oklch(44.6% 0.043 257.281);\n --mie-color-slate-700: oklch(37.2% 0.044 257.287);\n --mie-color-slate-900: oklch(20.8% 0.042 265.755);\n --mie-color-gray-50: oklch(98.5% 0.002 247.839);\n --mie-color-gray-100: oklch(96.7% 0.003 264.542);\n --mie-color-gray-200: oklch(92.8% 0.006 264.531);\n --mie-color-gray-300: oklch(87.2% 0.01 258.338);\n --mie-color-gray-400: oklch(70.7% 0.022 261.325);\n --mie-color-gray-500: oklch(55.1% 0.027 264.364);\n --mie-color-gray-600: oklch(44.6% 0.03 256.802);\n --mie-color-gray-700: oklch(37.3% 0.034 259.733);\n --mie-color-gray-800: oklch(27.8% 0.033 256.848);\n --mie-color-gray-900: oklch(21% 0.034 264.665);\n --mie-color-black: #000;\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-text-2xl: 1.5rem;\n --mie-text-2xl--line-height: calc(2 / 1.5);\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-font-weight-bold: 700;\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}\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\\:mr-2 {\n margin-right: calc(var(--mie-spacing) * 2);\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-9 {\n height: calc(var(--mie-spacing) * 9);\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-9 {\n width: calc(var(--mie-spacing) * 9);\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-black\\/10 {\n border-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-black) 10%, transparent);\n }\n}\n.mie\\:border-black\\/15 {\n border-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-black) 15%, transparent);\n }\n}\n.mie\\:border-black\\/20 {\n border-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--mie-color-black) 20%, transparent);\n }\n}\n.mie\\:border-blue-200 {\n border-color: var(--mie-color-blue-200);\n}\n.mie\\:border-blue-300 {\n border-color: var(--mie-color-blue-300);\n}\n.mie\\:border-blue-400 {\n border-color: var(--mie-color-blue-400);\n}\n.mie\\:border-blue-600 {\n border-color: var(--mie-color-blue-600);\n}\n.mie\\:border-gray-100 {\n border-color: var(--mie-color-gray-100);\n}\n.mie\\:border-gray-200 {\n border-color: var(--mie-color-gray-200);\n}\n.mie\\:border-gray-300 {\n border-color: var(--mie-color-gray-300);\n}\n.mie\\:border-orange-500 {\n border-color: var(--mie-color-orange-500);\n}\n.mie\\:border-red-200 {\n border-color: var(--mie-color-red-200);\n}\n.mie\\:border-red-300 {\n border-color: var(--mie-color-red-300);\n}\n.mie\\:border-slate-200 {\n border-color: var(--mie-color-slate-200);\n}\n.mie\\:border-slate-300 {\n border-color: var(--mie-color-slate-300);\n}\n.mie\\:border-transparent {\n border-color: transparent;\n}\n.mie\\:bg-black\\/5 {\n background-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-black) 5%, transparent);\n }\n}\n.mie\\:bg-black\\/30 {\n background-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-black) 30%, transparent);\n }\n}\n.mie\\:bg-black\\/50 {\n background-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-black) 50%, transparent);\n }\n}\n.mie\\:bg-blue-50 {\n background-color: var(--mie-color-blue-50);\n}\n.mie\\:bg-blue-100 {\n background-color: var(--mie-color-blue-100);\n}\n.mie\\:bg-blue-400 {\n background-color: var(--mie-color-blue-400);\n}\n.mie\\:bg-blue-500 {\n background-color: var(--mie-color-blue-500);\n}\n.mie\\:bg-blue-600 {\n background-color: var(--mie-color-blue-600);\n}\n.mie\\:bg-gray-50 {\n background-color: var(--mie-color-gray-50);\n}\n.mie\\:bg-gray-100 {\n background-color: var(--mie-color-gray-100);\n}\n.mie\\:bg-gray-200 {\n background-color: var(--mie-color-gray-200);\n}\n.mie\\:bg-gray-300 {\n background-color: var(--mie-color-gray-300);\n}\n.mie\\:bg-gray-700 {\n background-color: var(--mie-color-gray-700);\n}\n.mie\\:bg-orange-50 {\n background-color: var(--mie-color-orange-50);\n}\n.mie\\:bg-orange-500 {\n background-color: var(--mie-color-orange-500);\n}\n.mie\\:bg-red-50 {\n background-color: var(--mie-color-red-50);\n}\n.mie\\:bg-red-100 {\n background-color: var(--mie-color-red-100);\n}\n.mie\\:bg-slate-50 {\n background-color: var(--mie-color-slate-50);\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\\:bg-linear-to-r {\n --tw-gradient-position: to right;\n @supports (background-image: linear-gradient(in lab, red, red)) {\n --tw-gradient-position: to right in oklab;\n }\n background-image: linear-gradient(var(--tw-gradient-stops));\n}\n.mie\\:from-blue-50 {\n --tw-gradient-from: var(--mie-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.mie\\:from-gray-50 {\n --tw-gradient-from: var(--mie-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.mie\\:to-gray-50 {\n --tw-gradient-to: var(--mie-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.mie\\:to-gray-100 {\n --tw-gradient-to: var(--mie-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.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-bold {\n --tw-font-weight: var(--mie-font-weight-bold);\n font-weight: var(--mie-font-weight-bold);\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-blue-500 {\n color: var(--mie-color-blue-500);\n}\n.mie\\:text-blue-600 {\n color: var(--mie-color-blue-600);\n}\n.mie\\:text-blue-800 {\n color: var(--mie-color-blue-800);\n}\n.mie\\:text-blue-900 {\n color: var(--mie-color-blue-900);\n}\n.mie\\:text-gray-300 {\n color: var(--mie-color-gray-300);\n}\n.mie\\:text-gray-400 {\n color: var(--mie-color-gray-400);\n}\n.mie\\:text-gray-500 {\n color: var(--mie-color-gray-500);\n}\n.mie\\:text-gray-600 {\n color: var(--mie-color-gray-600);\n}\n.mie\\:text-gray-700 {\n color: var(--mie-color-gray-700);\n}\n.mie\\:text-gray-800 {\n color: var(--mie-color-gray-800);\n}\n.mie\\:text-gray-900 {\n color: var(--mie-color-gray-900);\n}\n.mie\\:text-orange-700 {\n color: var(--mie-color-orange-700);\n}\n.mie\\:text-red-600 {\n color: var(--mie-color-red-600);\n}\n.mie\\:text-red-700 {\n color: var(--mie-color-red-700);\n}\n.mie\\:text-slate-400 {\n color: var(--mie-color-slate-400);\n}\n.mie\\:text-slate-500 {\n color: var(--mie-color-slate-500);\n}\n.mie\\:text-slate-600 {\n color: var(--mie-color-slate-600);\n}\n.mie\\:text-slate-700 {\n color: var(--mie-color-slate-700);\n}\n.mie\\:text-slate-900 {\n color: var(--mie-color-slate-900);\n}\n.mie\\:text-white {\n color: var(--mie-color-white);\n}\n.mie\\:uppercase {\n text-transform: uppercase;\n}\n.mie\\:italic {\n font-style: italic;\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-blue-500 {\n --tw-ring-color: var(--mie-color-blue-500);\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\\: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-blue-300 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-blue-300);\n }\n }\n}\n.mie\\:hover\\:border-blue-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-blue-400);\n }\n }\n}\n.mie\\:hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--mie-color-gray-400);\n }\n }\n}\n.mie\\:hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-black);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--mie-color-black) 5%, transparent);\n }\n }\n }\n}\n.mie\\:hover\\:bg-blue-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-blue-50);\n }\n }\n}\n.mie\\:hover\\:bg-blue-500 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-blue-500);\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-blue-700 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-blue-700);\n }\n }\n}\n.mie\\:hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-gray-200);\n }\n }\n}\n.mie\\:hover\\:bg-gray-300 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-gray-300);\n }\n }\n}\n.mie\\:hover\\:bg-orange-600 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-orange-600);\n }\n }\n}\n.mie\\:hover\\:bg-red-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-red-50);\n }\n }\n}\n.mie\\:hover\\:bg-red-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-red-200);\n }\n }\n}\n.mie\\:hover\\:bg-slate-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-slate-50);\n }\n }\n}\n.mie\\:hover\\:bg-white {\n &:hover {\n @media (hover: hover) {\n background-color: var(--mie-color-white);\n }\n }\n}\n.mie\\:hover\\:from-blue-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-from: var(--mie-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.mie\\:hover\\:to-gray-100 {\n &:hover {\n @media (hover: hover) {\n --tw-gradient-to: var(--mie-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.mie\\:hover\\:text-blue-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-blue-600);\n }\n }\n}\n.mie\\:hover\\:text-blue-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-blue-700);\n }\n }\n}\n.mie\\:hover\\:text-red-600 {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-red-600);\n }\n }\n}\n.mie\\:hover\\:text-red-700 {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-red-700);\n }\n }\n}\n.mie\\:hover\\:text-slate-900 {\n &:hover {\n @media (hover: hover) {\n color: var(--mie-color-slate-900);\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-gray-300 {\n &:hover {\n @media (hover: hover) {\n --tw-ring-color: var(--mie-color-gray-300);\n }\n }\n}\n.mie\\:focus\\:border-blue-400 {\n &:focus {\n border-color: var(--mie-color-blue-400);\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-blue-400 {\n &:focus {\n --tw-ring-color: var(--mie-color-blue-400);\n }\n}\n.mie\\:focus\\:ring-blue-500 {\n &:focus {\n --tw-ring-color: var(--mie-color-blue-500);\n }\n}\n.mie\\:focus\\:ring-slate-500 {\n &:focus {\n --tw-ring-color: var(--mie-color-slate-500);\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\\:mt-4 {\n @media (width >= 48rem) {\n margin-top: calc(var(--mie-spacing) * 4);\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\\:mt-6 {\n @media (width >= 64rem) {\n margin-top: 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-2xl {\n @media (width >= 64rem) {\n font-size: var(--mie-text-2xl);\n line-height: var(--tw-leading, var(--mie-text-2xl--line-height));\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}\ndiv:focus-visible, button:focus-visible {\n outline: none;\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";
|
|
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
|
|
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
|
|
15
|
-
import
|
|
16
|
-
import { useStore as
|
|
17
|
-
var
|
|
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
18
|
var Te;
|
|
19
|
-
function
|
|
19
|
+
function Tt() {
|
|
20
20
|
if (Te) return Z;
|
|
21
21
|
Te = 1;
|
|
22
22
|
var e = /* @__PURE__ */ Symbol.for("react.transitional.element"), i = /* @__PURE__ */ Symbol.for("react.fragment");
|
|
23
23
|
function r(n, s, o) {
|
|
24
|
-
var
|
|
25
|
-
if (o !== void 0 && (
|
|
24
|
+
var d = null;
|
|
25
|
+
if (o !== void 0 && (d = "" + o), s.key !== void 0 && (d = "" + s.key), "key" in s) {
|
|
26
26
|
o = {};
|
|
27
|
-
for (var
|
|
28
|
-
|
|
27
|
+
for (var m in s)
|
|
28
|
+
m !== "key" && (o[m] = s[m]);
|
|
29
29
|
} else o = s;
|
|
30
30
|
return s = o.ref, {
|
|
31
31
|
$$typeof: e,
|
|
32
32
|
type: n,
|
|
33
|
-
key:
|
|
33
|
+
key: d,
|
|
34
34
|
ref: s !== void 0 ? s : null,
|
|
35
35
|
props: o
|
|
36
36
|
};
|
|
@@ -39,166 +39,166 @@ function Ot() {
|
|
|
39
39
|
}
|
|
40
40
|
var ee = {};
|
|
41
41
|
var Ie;
|
|
42
|
-
function
|
|
42
|
+
function It() {
|
|
43
43
|
return Ie || (Ie = 1, process.env.NODE_ENV !== "production" && (function() {
|
|
44
|
-
function e(
|
|
45
|
-
if (
|
|
46
|
-
if (typeof
|
|
47
|
-
return
|
|
48
|
-
if (typeof
|
|
49
|
-
switch (
|
|
50
|
-
case
|
|
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:
|
|
51
51
|
return "Fragment";
|
|
52
|
-
case
|
|
52
|
+
case j:
|
|
53
53
|
return "Profiler";
|
|
54
|
-
case
|
|
54
|
+
case R:
|
|
55
55
|
return "StrictMode";
|
|
56
|
-
case
|
|
56
|
+
case x:
|
|
57
57
|
return "Suspense";
|
|
58
|
-
case
|
|
58
|
+
case f:
|
|
59
59
|
return "SuspenseList";
|
|
60
|
-
case
|
|
60
|
+
case k:
|
|
61
61
|
return "Activity";
|
|
62
62
|
}
|
|
63
|
-
if (typeof
|
|
64
|
-
switch (typeof
|
|
63
|
+
if (typeof a == "object")
|
|
64
|
+
switch (typeof a.tag == "number" && console.error(
|
|
65
65
|
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
|
|
66
|
-
),
|
|
67
|
-
case
|
|
66
|
+
), a.$$typeof) {
|
|
67
|
+
case N:
|
|
68
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;
|
|
69
76
|
case T:
|
|
70
|
-
return
|
|
71
|
-
case
|
|
72
|
-
|
|
73
|
-
case m:
|
|
74
|
-
var x = l.render;
|
|
75
|
-
return l = l.displayName, l || (l = x.displayName || x.name || "", l = l !== "" ? "ForwardRef(" + l + ")" : "ForwardRef"), l;
|
|
76
|
-
case q:
|
|
77
|
-
return x = l.displayName || null, x !== null ? x : e(l.type) || "Memo";
|
|
78
|
-
case C:
|
|
79
|
-
x = l._payload, l = l._init;
|
|
77
|
+
return v = a.displayName || null, v !== null ? v : e(a.type) || "Memo";
|
|
78
|
+
case w:
|
|
79
|
+
v = a._payload, a = a._init;
|
|
80
80
|
try {
|
|
81
|
-
return e(
|
|
81
|
+
return e(a(v));
|
|
82
82
|
} catch {
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
85
|
return null;
|
|
86
86
|
}
|
|
87
|
-
function i(
|
|
88
|
-
return "" +
|
|
87
|
+
function i(a) {
|
|
88
|
+
return "" + a;
|
|
89
89
|
}
|
|
90
|
-
function r(
|
|
90
|
+
function r(a) {
|
|
91
91
|
try {
|
|
92
|
-
i(
|
|
93
|
-
var
|
|
92
|
+
i(a);
|
|
93
|
+
var v = !1;
|
|
94
94
|
} catch {
|
|
95
|
-
|
|
95
|
+
v = !0;
|
|
96
96
|
}
|
|
97
|
-
if (
|
|
98
|
-
|
|
99
|
-
var
|
|
100
|
-
return
|
|
101
|
-
|
|
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
102
|
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
103
103
|
D
|
|
104
|
-
), i(
|
|
104
|
+
), i(a);
|
|
105
105
|
}
|
|
106
106
|
}
|
|
107
|
-
function n(
|
|
108
|
-
if (
|
|
109
|
-
if (typeof
|
|
107
|
+
function n(a) {
|
|
108
|
+
if (a === O) return "<>";
|
|
109
|
+
if (typeof a == "object" && a !== null && a.$$typeof === w)
|
|
110
110
|
return "<...>";
|
|
111
111
|
try {
|
|
112
|
-
var
|
|
113
|
-
return
|
|
112
|
+
var v = e(a);
|
|
113
|
+
return v ? "<" + v + ">" : "<...>";
|
|
114
114
|
} catch {
|
|
115
115
|
return "<...>";
|
|
116
116
|
}
|
|
117
117
|
}
|
|
118
118
|
function s() {
|
|
119
|
-
var
|
|
120
|
-
return
|
|
119
|
+
var a = p.A;
|
|
120
|
+
return a === null ? null : a.getOwner();
|
|
121
121
|
}
|
|
122
122
|
function o() {
|
|
123
123
|
return Error("react-stack-top-frame");
|
|
124
124
|
}
|
|
125
|
-
function
|
|
126
|
-
if (
|
|
127
|
-
var
|
|
128
|
-
if (
|
|
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;
|
|
129
129
|
}
|
|
130
|
-
return
|
|
130
|
+
return a.key !== void 0;
|
|
131
131
|
}
|
|
132
|
-
function a
|
|
133
|
-
function
|
|
134
|
-
|
|
132
|
+
function m(a, v) {
|
|
133
|
+
function y() {
|
|
134
|
+
F || (F = !0, console.error(
|
|
135
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
|
-
|
|
136
|
+
v
|
|
137
137
|
));
|
|
138
138
|
}
|
|
139
|
-
|
|
140
|
-
get:
|
|
139
|
+
y.isReactWarning = !0, Object.defineProperty(a, "key", {
|
|
140
|
+
get: y,
|
|
141
141
|
configurable: !0
|
|
142
142
|
});
|
|
143
143
|
}
|
|
144
|
-
function
|
|
145
|
-
var
|
|
146
|
-
return
|
|
144
|
+
function c() {
|
|
145
|
+
var a = e(this.type);
|
|
146
|
+
return $[a] || ($[a] = !0, console.error(
|
|
147
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
|
-
)),
|
|
148
|
+
)), a = this.props.ref, a !== void 0 ? a : null;
|
|
149
149
|
}
|
|
150
|
-
function
|
|
151
|
-
var
|
|
152
|
-
return
|
|
153
|
-
$$typeof:
|
|
154
|
-
type:
|
|
155
|
-
key:
|
|
156
|
-
props:
|
|
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
157
|
_owner: D
|
|
158
|
-
}, (
|
|
158
|
+
}, (q !== void 0 ? q : null) !== null ? Object.defineProperty(a, "ref", {
|
|
159
159
|
enumerable: !1,
|
|
160
|
-
get:
|
|
161
|
-
}) : Object.defineProperty(
|
|
160
|
+
get: c
|
|
161
|
+
}) : Object.defineProperty(a, "ref", { enumerable: !1, value: null }), a._store = {}, Object.defineProperty(a._store, "validated", {
|
|
162
162
|
configurable: !1,
|
|
163
163
|
enumerable: !1,
|
|
164
164
|
writable: !0,
|
|
165
165
|
value: 0
|
|
166
|
-
}), Object.defineProperty(
|
|
166
|
+
}), Object.defineProperty(a, "_debugInfo", {
|
|
167
167
|
configurable: !1,
|
|
168
168
|
enumerable: !1,
|
|
169
169
|
writable: !0,
|
|
170
170
|
value: null
|
|
171
|
-
}), Object.defineProperty(
|
|
171
|
+
}), Object.defineProperty(a, "_debugStack", {
|
|
172
172
|
configurable: !1,
|
|
173
173
|
enumerable: !1,
|
|
174
174
|
writable: !0,
|
|
175
175
|
value: oe
|
|
176
|
-
}), Object.defineProperty(
|
|
176
|
+
}), Object.defineProperty(a, "_debugTask", {
|
|
177
177
|
configurable: !1,
|
|
178
178
|
enumerable: !1,
|
|
179
179
|
writable: !0,
|
|
180
180
|
value: be
|
|
181
|
-
}), Object.freeze && (Object.freeze(
|
|
181
|
+
}), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
|
|
182
182
|
}
|
|
183
|
-
function
|
|
184
|
-
var
|
|
185
|
-
if (
|
|
183
|
+
function h(a, v, y, D, oe, be) {
|
|
184
|
+
var q = v.children;
|
|
185
|
+
if (q !== void 0)
|
|
186
186
|
if (D)
|
|
187
|
-
if (
|
|
188
|
-
for (D = 0; D <
|
|
189
|
-
g(
|
|
190
|
-
Object.freeze && Object.freeze(
|
|
187
|
+
if (M(q)) {
|
|
188
|
+
for (D = 0; D < q.length; D++)
|
|
189
|
+
g(q[D]);
|
|
190
|
+
Object.freeze && Object.freeze(q);
|
|
191
191
|
} else
|
|
192
192
|
console.error(
|
|
193
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
194
|
);
|
|
195
|
-
else g(
|
|
196
|
-
if (
|
|
197
|
-
|
|
198
|
-
var X = Object.keys(
|
|
195
|
+
else g(q);
|
|
196
|
+
if (C.call(v, "key")) {
|
|
197
|
+
q = e(a);
|
|
198
|
+
var X = Object.keys(v).filter(function(et) {
|
|
199
199
|
return et !== "key";
|
|
200
200
|
});
|
|
201
|
-
D = 0 < X.length ? "{key: someKey, " + X.join(": ..., ") + ": ...}" : "{key: someKey}", Y[
|
|
201
|
+
D = 0 < X.length ? "{key: someKey, " + X.join(": ..., ") + ": ...}" : "{key: someKey}", Y[q + D] || (X = 0 < X.length ? "{" + X.join(": ..., ") + ": ...}" : "{}", console.error(
|
|
202
202
|
`A props object containing a "key" prop is being spread into JSX:
|
|
203
203
|
let props = %s;
|
|
204
204
|
<%s {...props} />
|
|
@@ -206,245 +206,242 @@ React keys must be passed directly to JSX without using spread:
|
|
|
206
206
|
let props = %s;
|
|
207
207
|
<%s key={someKey} {...props} />`,
|
|
208
208
|
D,
|
|
209
|
-
|
|
209
|
+
q,
|
|
210
210
|
X,
|
|
211
|
-
|
|
212
|
-
), Y[
|
|
211
|
+
q
|
|
212
|
+
), Y[q + D] = !0);
|
|
213
213
|
}
|
|
214
|
-
if (
|
|
215
|
-
|
|
216
|
-
for (var
|
|
217
|
-
|
|
218
|
-
} else
|
|
219
|
-
return
|
|
220
|
-
|
|
221
|
-
typeof
|
|
222
|
-
),
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
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
226
|
s(),
|
|
227
227
|
oe,
|
|
228
228
|
be
|
|
229
229
|
);
|
|
230
230
|
}
|
|
231
|
-
function g(
|
|
232
|
-
|
|
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));
|
|
233
233
|
}
|
|
234
|
-
function
|
|
235
|
-
return typeof
|
|
234
|
+
function A(a) {
|
|
235
|
+
return typeof a == "object" && a !== null && a.$$typeof === _;
|
|
236
236
|
}
|
|
237
|
-
var
|
|
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
238
|
return null;
|
|
239
239
|
};
|
|
240
|
-
|
|
241
|
-
react_stack_bottom_frame: function(
|
|
242
|
-
return
|
|
240
|
+
L = {
|
|
241
|
+
react_stack_bottom_frame: function(a) {
|
|
242
|
+
return a();
|
|
243
243
|
}
|
|
244
244
|
};
|
|
245
|
-
var
|
|
246
|
-
|
|
245
|
+
var F, $ = {}, z = L.react_stack_bottom_frame.bind(
|
|
246
|
+
L,
|
|
247
247
|
o
|
|
248
|
-
)(), H =
|
|
249
|
-
ee.Fragment =
|
|
248
|
+
)(), H = E(n(o)), Y = {};
|
|
249
|
+
ee.Fragment = O, ee.jsx = function(a, v, y) {
|
|
250
250
|
var D = 1e4 > p.recentlyCreatedOwnerStacks++;
|
|
251
|
-
return
|
|
252
|
-
|
|
253
|
-
x,
|
|
251
|
+
return h(
|
|
252
|
+
a,
|
|
254
253
|
v,
|
|
254
|
+
y,
|
|
255
255
|
!1,
|
|
256
|
-
D ? Error("react-stack-top-frame") :
|
|
257
|
-
D ?
|
|
256
|
+
D ? Error("react-stack-top-frame") : z,
|
|
257
|
+
D ? E(n(a)) : H
|
|
258
258
|
);
|
|
259
|
-
}, ee.jsxs = function(
|
|
259
|
+
}, ee.jsxs = function(a, v, y) {
|
|
260
260
|
var D = 1e4 > p.recentlyCreatedOwnerStacks++;
|
|
261
|
-
return
|
|
262
|
-
|
|
263
|
-
x,
|
|
261
|
+
return h(
|
|
262
|
+
a,
|
|
264
263
|
v,
|
|
264
|
+
y,
|
|
265
265
|
!0,
|
|
266
|
-
D ? Error("react-stack-top-frame") :
|
|
267
|
-
D ?
|
|
266
|
+
D ? Error("react-stack-top-frame") : z,
|
|
267
|
+
D ? E(n(a)) : H
|
|
268
268
|
);
|
|
269
269
|
};
|
|
270
270
|
})()), ee;
|
|
271
271
|
}
|
|
272
272
|
var Se;
|
|
273
|
-
function It() {
|
|
274
|
-
return Se || (Se = 1, process.env.NODE_ENV === "production" ? ae.exports = Ot() : ae.exports = Tt()), ae.exports;
|
|
275
|
-
}
|
|
276
|
-
var t = It();
|
|
277
273
|
function St() {
|
|
278
|
-
|
|
274
|
+
return Se || (Se = 1, process.env.NODE_ENV === "production" ? me.exports = Tt() : me.exports = It()), me.exports;
|
|
275
|
+
}
|
|
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) => {
|
|
279
279
|
try {
|
|
280
|
-
const
|
|
281
|
-
if (
|
|
282
|
-
|
|
280
|
+
const I = String(j).replace(/^\uFEFF/, "").trim(), { data: S, schemaType: b } = fe(I);
|
|
281
|
+
if (b !== "mieforms" && b !== "surveyjs") {
|
|
282
|
+
d(
|
|
283
283
|
`Expected: MIE Forms or SurveyJS
|
|
284
|
-
Detected: ${
|
|
284
|
+
Detected: ${b}`,
|
|
285
285
|
{ title: "Unsupported Schema Format" }
|
|
286
286
|
);
|
|
287
287
|
return;
|
|
288
288
|
}
|
|
289
|
-
n({ data:
|
|
290
|
-
} catch (
|
|
291
|
-
|
|
292
|
-
|
|
289
|
+
n({ data: S, detectedSchemaType: b }), i(!0);
|
|
290
|
+
} catch (I) {
|
|
291
|
+
d(
|
|
292
|
+
I?.message || "Invalid file format",
|
|
293
293
|
{ title: "Failed to Parse File" }
|
|
294
294
|
);
|
|
295
295
|
}
|
|
296
|
-
},
|
|
296
|
+
}, A = (j) => {
|
|
297
297
|
if (r)
|
|
298
298
|
try {
|
|
299
|
-
const { data:
|
|
300
|
-
if (!Array.isArray(
|
|
299
|
+
const { data: I } = r, S = pe(I, j), b = S.fields || [];
|
|
300
|
+
if (!Array.isArray(b))
|
|
301
301
|
throw new Error("Expected array of fields");
|
|
302
|
-
|
|
303
|
-
const
|
|
304
|
-
schemaType:
|
|
305
|
-
...
|
|
306
|
-
fields:
|
|
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
|
|
307
307
|
};
|
|
308
|
-
if (
|
|
309
|
-
const { fields:
|
|
310
|
-
Object.keys(
|
|
308
|
+
if (j === "mieforms") {
|
|
309
|
+
const { fields: f, schemaType: T, ...w } = I;
|
|
310
|
+
Object.keys(w).length > 0 && Object.assign(x, w);
|
|
311
311
|
}
|
|
312
|
-
if (s(
|
|
313
|
-
const
|
|
314
|
-
|
|
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(
|
|
315
315
|
`Format: SurveyJS → MIE Forms
|
|
316
316
|
|
|
317
|
-
Converted: ${
|
|
318
|
-
Unsupported: ${
|
|
317
|
+
Converted: ${f.convertedFields || 0} field(s)
|
|
318
|
+
Unsupported: ${T} field(s)${T > 0 ? " ⚠️" : ""}`,
|
|
319
319
|
{ title: "✅ Import Successful" }
|
|
320
320
|
);
|
|
321
321
|
} else
|
|
322
|
-
|
|
323
|
-
`Format: ${
|
|
324
|
-
Loaded ${
|
|
322
|
+
d(
|
|
323
|
+
`Format: ${j === "surveyjs" ? "SurveyJS" : "MIE Forms"}
|
|
324
|
+
Loaded ${b.length} field(s)`,
|
|
325
325
|
{ title: "✅ Import Successful" }
|
|
326
326
|
);
|
|
327
327
|
i(!1), n(null);
|
|
328
|
-
} catch (
|
|
329
|
-
|
|
330
|
-
|
|
328
|
+
} catch (I) {
|
|
329
|
+
d(
|
|
330
|
+
I?.message || "Invalid format",
|
|
331
331
|
{ title: "Import Failed" }
|
|
332
332
|
), i(!1), n(null);
|
|
333
333
|
}
|
|
334
|
-
},
|
|
334
|
+
}, L = () => {
|
|
335
335
|
i(!1), n(null);
|
|
336
|
-
},
|
|
337
|
-
|
|
338
|
-
},
|
|
339
|
-
|
|
340
|
-
},
|
|
341
|
-
|
|
342
|
-
},
|
|
343
|
-
const
|
|
344
|
-
|
|
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();
|
|
342
|
+
}, R = () => {
|
|
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);
|
|
345
345
|
};
|
|
346
|
-
return /* @__PURE__ */ t.jsxs("header", { className: "editor-header mie:w-full mie:bg-
|
|
347
|
-
/* @__PURE__ */ t.
|
|
348
|
-
/* @__PURE__ */ t.
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
"
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
children:
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
"
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
children:
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
"
|
|
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",
|
|
378
394
|
{
|
|
379
|
-
className:
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
}
|
|
388
|
-
)
|
|
389
|
-
] }),
|
|
390
|
-
/* @__PURE__ */ t.jsxs("div", { className: "header-actions mie:flex mie:gap-1 mie:items-center", children: [
|
|
391
|
-
/* @__PURE__ */ t.jsxs("label", { className: "header-import-label mie:px-2 mie:py-2 mie:lg:px-3 mie:lg:py-2 mie:rounded-lg mie:border mie:border-black/15 mie:bg-white mie:hover:bg-black/5 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", children: [
|
|
392
|
-
/* @__PURE__ */ t.jsx(nt, { className: "mie:w-4 mie:h-4 mie:lg:w-4 mie:lg:h-4" }),
|
|
393
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:hidden min-[445px]:inline", children: "Import" }),
|
|
394
|
-
/* @__PURE__ */ t.jsx(
|
|
395
|
-
"input",
|
|
396
|
-
{
|
|
397
|
-
className: "mie:hidden",
|
|
398
|
-
type: "file",
|
|
399
|
-
accept: ".json,.yaml,.yml,application/json,text/yaml",
|
|
400
|
-
onChange: (N) => {
|
|
401
|
-
const k = N.target.files?.[0];
|
|
402
|
-
if (!k) return;
|
|
403
|
-
const T = new FileReader();
|
|
404
|
-
T.onload = (m) => g(m.target?.result ?? ""), T.readAsText(k), N.target.value = "";
|
|
405
|
-
}
|
|
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 = "";
|
|
406
403
|
}
|
|
407
|
-
)
|
|
408
|
-
] }),
|
|
409
|
-
/* @__PURE__ */ t.jsxs(
|
|
410
|
-
"button",
|
|
411
|
-
{
|
|
412
|
-
className: "mie:px-2 mie:py-2 mie:lg:px-3 mie:lg:py-2 mie:rounded-lg mie:border mie:border-black/15 mie:bg-white mie:hover:bg-black/5 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",
|
|
413
|
-
onClick: F,
|
|
414
|
-
title: "Export",
|
|
415
|
-
children: [
|
|
416
|
-
/* @__PURE__ */ t.jsx(st, { className: "mie:w-4 mie:h-4 mie:lg:w-4 mie:lg:h-4" }),
|
|
417
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:hidden min-[445px]:inline", children: "Export" })
|
|
418
|
-
]
|
|
419
404
|
}
|
|
420
405
|
)
|
|
421
|
-
] })
|
|
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
|
+
)
|
|
422
419
|
] })
|
|
423
|
-
] }),
|
|
424
|
-
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-
|
|
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: [
|
|
425
422
|
/* @__PURE__ */ t.jsxs("div", { className: "import-modal-header mie:mb-6", children: [
|
|
426
|
-
/* @__PURE__ */ t.jsx("h3", { className: "mie:text-xl mie:font-semibold mie:text-
|
|
427
|
-
/* @__PURE__ */ t.jsxs("p", { className: "mie:text-sm mie:text-
|
|
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: [
|
|
428
425
|
"Is this a ",
|
|
429
|
-
/* @__PURE__ */ t.jsx("strong", { className: "mie:text-
|
|
426
|
+
/* @__PURE__ */ t.jsx("strong", { className: "mie:text-mietext", children: r.detectedSchemaType === "surveyjs" ? "SurveyJS" : "MIE Forms" }),
|
|
430
427
|
" schema?"
|
|
431
428
|
] }),
|
|
432
|
-
r.detectedSchemaType === "surveyjs" && /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-
|
|
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." })
|
|
433
430
|
] }),
|
|
434
431
|
/* @__PURE__ */ t.jsxs("div", { className: "import-modal-actions mie:flex mie:gap-3", children: [
|
|
435
432
|
/* @__PURE__ */ t.jsx(
|
|
436
433
|
"button",
|
|
437
434
|
{
|
|
438
|
-
onClick: () =>
|
|
439
|
-
className: "mie:flex-1 mie:px-6 mie:py-3 mie:rounded-xl mie:bg-
|
|
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",
|
|
440
437
|
children: "Yes, Import"
|
|
441
438
|
}
|
|
442
439
|
),
|
|
443
440
|
/* @__PURE__ */ t.jsx(
|
|
444
441
|
"button",
|
|
445
442
|
{
|
|
446
|
-
onClick:
|
|
447
|
-
className: "mie:flex-1 mie:px-6 mie:py-3 mie:rounded-xl mie:border-2 mie:border-
|
|
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",
|
|
448
445
|
children: "Abort"
|
|
449
446
|
}
|
|
450
447
|
)
|
|
@@ -452,7 +449,7 @@ Loaded ${m.length} field(s)`,
|
|
|
452
449
|
] }) })
|
|
453
450
|
] });
|
|
454
451
|
}
|
|
455
|
-
const
|
|
452
|
+
const Rt = (e) => {
|
|
456
453
|
switch (e) {
|
|
457
454
|
case "Text Fields":
|
|
458
455
|
return ft;
|
|
@@ -461,100 +458,100 @@ const kt = (e) => {
|
|
|
461
458
|
case "Selection Fields":
|
|
462
459
|
return dt;
|
|
463
460
|
case "Rating & Ranking":
|
|
464
|
-
return mt;
|
|
465
|
-
case "Matrix Fields":
|
|
466
461
|
return ct;
|
|
462
|
+
case "Matrix Fields":
|
|
463
|
+
return lt;
|
|
467
464
|
case "Rich Content":
|
|
468
|
-
return
|
|
465
|
+
return mt;
|
|
469
466
|
default:
|
|
470
467
|
return null;
|
|
471
468
|
}
|
|
472
|
-
},
|
|
469
|
+
}, At = ({ isPreview: e = !1 }) => {
|
|
473
470
|
if (e) return null;
|
|
474
|
-
const i = V((
|
|
471
|
+
const i = V((u) => u.addField), r = B(), n = V(
|
|
475
472
|
de(
|
|
476
|
-
(
|
|
473
|
+
(u) => r.selectedFieldId.value ? u.byId[r.selectedFieldId.value] : null,
|
|
477
474
|
[r.selectedFieldId.value]
|
|
478
475
|
)
|
|
479
|
-
), s = n?.fieldType === "section", o = n?.title || "Section",
|
|
476
|
+
), s = n?.fieldType === "section", o = n?.title || "Section", d = l.useCallback(() => {
|
|
480
477
|
r.selectedFieldId.set(null);
|
|
481
478
|
}, [r.selectedFieldId]);
|
|
482
|
-
|
|
483
|
-
const
|
|
484
|
-
|
|
479
|
+
l.useEffect(() => {
|
|
480
|
+
const u = (h) => {
|
|
481
|
+
h.key === "Escape" && (h.preventDefault(), h.stopPropagation(), d());
|
|
485
482
|
};
|
|
486
|
-
return window.addEventListener("keydown",
|
|
487
|
-
}, [
|
|
488
|
-
const
|
|
489
|
-
const
|
|
490
|
-
return Object.entries(K).filter(([
|
|
491
|
-
const
|
|
492
|
-
|
|
493
|
-
type:
|
|
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,
|
|
494
491
|
label: g.label
|
|
495
492
|
});
|
|
496
|
-
}),
|
|
497
|
-
}, []),
|
|
498
|
-
const
|
|
499
|
-
return Object.values(
|
|
500
|
-
|
|
501
|
-
|
|
493
|
+
}), u;
|
|
494
|
+
}, []), c = Ee(() => {
|
|
495
|
+
const u = {};
|
|
496
|
+
return Object.values(m).forEach((h) => {
|
|
497
|
+
h.forEach(({ type: g }) => {
|
|
498
|
+
u[g] = () => {
|
|
502
499
|
s && n?.id ? i(g, { sectionId: n.id }) : i(g);
|
|
503
500
|
};
|
|
504
501
|
});
|
|
505
|
-
}),
|
|
506
|
-
}, [
|
|
502
|
+
}), u;
|
|
503
|
+
}, [m, i, s, n?.id]);
|
|
507
504
|
return /* @__PURE__ */ t.jsx(
|
|
508
505
|
"div",
|
|
509
506
|
{
|
|
510
|
-
className: " mie:border mie:border-
|
|
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)]",
|
|
511
508
|
tabIndex: "-1",
|
|
512
509
|
children: /* @__PURE__ */ t.jsxs("div", { className: "tool-panel-container mie:pb-4 mie:rounded-lg mie:shadow-sm", children: [
|
|
513
|
-
/* @__PURE__ */ t.jsxs("h3", { className: "tool-panel-title mie:sticky mie:top-0 mie:z-20 mie:bg-
|
|
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: [
|
|
514
511
|
/* @__PURE__ */ t.jsxs("span", { className: "mie:flex mie:items-center mie:gap-2 mie:min-w-0", children: [
|
|
515
|
-
/* @__PURE__ */ t.jsx(ot, { className: "mie:w-5 mie:h-5 mie:text-
|
|
516
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:truncate", children: s ? `Add to "${o}"` : "Tools" })
|
|
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" })
|
|
517
514
|
] }),
|
|
518
515
|
s && /* @__PURE__ */ t.jsx(
|
|
519
516
|
"button",
|
|
520
517
|
{
|
|
521
|
-
onClick:
|
|
522
|
-
className: "mie:bg-transparent mie:text-
|
|
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",
|
|
523
520
|
title: "Unselect section",
|
|
524
|
-
children: /* @__PURE__ */ t.jsx(
|
|
521
|
+
children: /* @__PURE__ */ t.jsx(at, { className: "mie:w-5 mie:h-5" })
|
|
525
522
|
}
|
|
526
523
|
)
|
|
527
524
|
] }),
|
|
528
|
-
Object.entries(
|
|
529
|
-
/* @__PURE__ */ t.jsxs("h4", { className: "mie:sticky mie:top-11 mie:z-10 mie:bg-
|
|
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: [
|
|
530
527
|
(() => {
|
|
531
|
-
const g =
|
|
532
|
-
return g ? /* @__PURE__ */ t.jsx(g, { className: "mie:w-4 mie:h-4 mie:text-
|
|
528
|
+
const g = Rt(u);
|
|
529
|
+
return g ? /* @__PURE__ */ t.jsx(g, { className: "mie:w-4 mie:h-4 mie:text-mietextmuted" }) : null;
|
|
533
530
|
})(),
|
|
534
|
-
|
|
531
|
+
u
|
|
535
532
|
] }),
|
|
536
|
-
/* @__PURE__ */ t.jsx("div", { className: "tool-items mie:grid mie:grid-cols-1 mie:gap-2 mie:px-4 mie:py-3", children:
|
|
537
|
-
const
|
|
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";
|
|
538
535
|
return /* @__PURE__ */ t.jsxs(
|
|
539
536
|
"button",
|
|
540
537
|
{
|
|
541
|
-
disabled:
|
|
542
|
-
className: `mie:px-3 mie:py-2 mie:text-sm mie:text-left mie:border mie:rounded-md mie:transition-colors mie:duration-150 ${
|
|
543
|
-
onClick:
|
|
544
|
-
title:
|
|
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}`,
|
|
545
542
|
children: [
|
|
546
543
|
"+ ",
|
|
547
|
-
|
|
544
|
+
A
|
|
548
545
|
]
|
|
549
546
|
},
|
|
550
547
|
g
|
|
551
548
|
);
|
|
552
549
|
}) })
|
|
553
|
-
] },
|
|
550
|
+
] }, u))
|
|
554
551
|
] })
|
|
555
552
|
}
|
|
556
553
|
);
|
|
557
|
-
}, ke =
|
|
554
|
+
}, ke = l.memo(At, (e, i) => e.isPreview === i.isPreview);
|
|
558
555
|
function ze({
|
|
559
556
|
id: e = "",
|
|
560
557
|
label: i = "ID",
|
|
@@ -563,48 +560,48 @@ function ze({
|
|
|
563
560
|
placeholder: s = "Enter unique ID…",
|
|
564
561
|
className: o = ""
|
|
565
562
|
}) {
|
|
566
|
-
const [
|
|
567
|
-
|
|
568
|
-
|
|
563
|
+
const [d, m] = l.useState(e ?? ""), [c, u] = l.useState("");
|
|
564
|
+
l.useEffect(() => {
|
|
565
|
+
m(e ?? ""), u("");
|
|
569
566
|
}, [e]);
|
|
570
|
-
const
|
|
571
|
-
const g = String(
|
|
567
|
+
const h = l.useCallback(() => {
|
|
568
|
+
const g = String(d ?? "").trim();
|
|
572
569
|
if (!g) {
|
|
573
|
-
|
|
570
|
+
u("ID cannot be empty."), m(e ?? "");
|
|
574
571
|
return;
|
|
575
572
|
}
|
|
576
573
|
if (g !== (e ?? "")) {
|
|
577
574
|
if (typeof n == "function") {
|
|
578
|
-
const
|
|
579
|
-
if (
|
|
580
|
-
|
|
575
|
+
const A = n(g, e ?? "");
|
|
576
|
+
if (A) {
|
|
577
|
+
u(A);
|
|
581
578
|
return;
|
|
582
579
|
}
|
|
583
580
|
}
|
|
584
581
|
r?.(g);
|
|
585
582
|
}
|
|
586
|
-
}, [
|
|
583
|
+
}, [d, e, r, n]);
|
|
587
584
|
return /* @__PURE__ */ t.jsxs("div", { className: o ? `draft-id-editor-container ${o}` : "draft-id-editor-container", children: [
|
|
588
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:mb-1", children: i }),
|
|
585
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: i }),
|
|
589
586
|
/* @__PURE__ */ t.jsx(
|
|
590
587
|
"input",
|
|
591
588
|
{
|
|
592
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
593
|
-
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,
|
|
594
591
|
onChange: (g) => {
|
|
595
|
-
|
|
592
|
+
c && u(""), m(g.target.value);
|
|
596
593
|
},
|
|
597
|
-
onBlur:
|
|
594
|
+
onBlur: h,
|
|
598
595
|
onKeyDown: (g) => {
|
|
599
|
-
g.key === "Enter" && (g.preventDefault(),
|
|
596
|
+
g.key === "Enter" && (g.preventDefault(), h());
|
|
600
597
|
},
|
|
601
598
|
placeholder: s
|
|
602
599
|
}
|
|
603
600
|
),
|
|
604
|
-
|
|
601
|
+
c ? /* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-miedanger mie:mt-1", children: c }) : null
|
|
605
602
|
] });
|
|
606
603
|
}
|
|
607
|
-
const
|
|
604
|
+
const Pt = [
|
|
608
605
|
{ value: "text", label: "Text" },
|
|
609
606
|
{ value: "number", label: "Number" },
|
|
610
607
|
{ value: "email", label: "Email" },
|
|
@@ -614,7 +611,7 @@ const At = [
|
|
|
614
611
|
{ value: "month", label: "Month" },
|
|
615
612
|
{ value: "time", label: "Time" },
|
|
616
613
|
{ value: "range", label: "Range" }
|
|
617
|
-
],
|
|
614
|
+
], Mt = {
|
|
618
615
|
Length: [
|
|
619
616
|
{ value: "mm", label: "Millimeters (mm)" },
|
|
620
617
|
{ value: "cm", label: "Centimeters (cm)" },
|
|
@@ -652,32 +649,32 @@ const At = [
|
|
|
652
649
|
{ value: "mmHg", label: "mmHg (blood pressure)" }
|
|
653
650
|
]
|
|
654
651
|
};
|
|
655
|
-
function
|
|
652
|
+
function Ft({ field: e, onUpdate: i }) {
|
|
656
653
|
const r = e.inputType || "text", n = e.unit || "", s = r === "number" || r === "range";
|
|
657
654
|
return /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
658
655
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
659
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie: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" }),
|
|
660
657
|
/* @__PURE__ */ t.jsx(
|
|
661
658
|
"select",
|
|
662
659
|
{
|
|
663
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
664
661
|
value: r,
|
|
665
662
|
onChange: (o) => i("inputType", o.target.value),
|
|
666
|
-
children:
|
|
663
|
+
children: Pt.map((o) => /* @__PURE__ */ t.jsx("option", { value: o.value, children: o.label }, o.value))
|
|
667
664
|
}
|
|
668
665
|
)
|
|
669
666
|
] }),
|
|
670
667
|
s && /* @__PURE__ */ t.jsxs("div", { children: [
|
|
671
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:mb-1", children: "Unit (optional)" }),
|
|
668
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Unit (optional)" }),
|
|
672
669
|
/* @__PURE__ */ t.jsxs(
|
|
673
670
|
"select",
|
|
674
671
|
{
|
|
675
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
676
673
|
value: n,
|
|
677
674
|
onChange: (o) => i("unit", o.target.value),
|
|
678
675
|
children: [
|
|
679
676
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "None" }),
|
|
680
|
-
Object.entries(
|
|
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))
|
|
681
678
|
]
|
|
682
679
|
}
|
|
683
680
|
)
|
|
@@ -685,13 +682,13 @@ function Mt({ field: e, onUpdate: i }) {
|
|
|
685
682
|
] });
|
|
686
683
|
}
|
|
687
684
|
function We({ f: e, onUpdateField: i }) {
|
|
688
|
-
const r = V(
|
|
685
|
+
const r = V(l.useCallback((s) => s.byId, [])), n = l.useCallback((s, o) => {
|
|
689
686
|
if (!s?.trim()) return "ID cannot be empty.";
|
|
690
687
|
if (s === o) return "";
|
|
691
|
-
const
|
|
692
|
-
return Object.values(r).forEach((
|
|
693
|
-
|
|
694
|
-
}),
|
|
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.` : "";
|
|
695
692
|
}, [r]);
|
|
696
693
|
return /* @__PURE__ */ t.jsxs("div", { className: "common-editor-container mie:space-y-3", children: [
|
|
697
694
|
/* @__PURE__ */ t.jsx(
|
|
@@ -703,37 +700,37 @@ function We({ f: e, onUpdateField: i }) {
|
|
|
703
700
|
}
|
|
704
701
|
),
|
|
705
702
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
706
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie: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" }),
|
|
707
704
|
/* @__PURE__ */ t.jsx(
|
|
708
705
|
"input",
|
|
709
706
|
{
|
|
710
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
711
708
|
value: e.question || "",
|
|
712
709
|
onChange: (s) => i?.("question", s.target.value),
|
|
713
710
|
placeholder: "Enter question text"
|
|
714
711
|
}
|
|
715
712
|
)
|
|
716
713
|
] }),
|
|
717
|
-
(e.fieldType === "text" || e.fieldType === "longtext") && /* @__PURE__ */ t.jsx(
|
|
714
|
+
(e.fieldType === "text" || e.fieldType === "longtext") && /* @__PURE__ */ t.jsx(Ft, { field: e, onUpdate: i }),
|
|
718
715
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:min-w-0", children: [
|
|
719
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:mb-1", children: "Sublabel (optional)" }),
|
|
716
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:text-mietext mie:mb-1", children: "Sublabel (optional)" }),
|
|
720
717
|
/* @__PURE__ */ t.jsx(
|
|
721
718
|
"textarea",
|
|
722
719
|
{
|
|
723
|
-
className: "mie:w-full mie:min-w-0 mie:max-h-32 mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
724
721
|
value: e.sublabel || "",
|
|
725
722
|
onChange: (s) => i("sublabel", s.target.value),
|
|
726
723
|
placeholder: "Helper text / description"
|
|
727
724
|
}
|
|
728
725
|
)
|
|
729
726
|
] }),
|
|
730
|
-
/* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsxs("label", { className: "mie:inline-flex mie:items-center mie:gap-2 mie: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: [
|
|
731
728
|
/* @__PURE__ */ t.jsx(
|
|
732
|
-
|
|
729
|
+
pt,
|
|
733
730
|
{
|
|
734
|
-
type: "checkbox",
|
|
735
731
|
checked: !!e.required,
|
|
736
|
-
onChange: (s) => i?.("required", s
|
|
732
|
+
onChange: (s) => i?.("required", s),
|
|
733
|
+
size: "md"
|
|
737
734
|
}
|
|
738
735
|
),
|
|
739
736
|
"Required"
|
|
@@ -741,130 +738,130 @@ function We({ f: e, onUpdateField: i }) {
|
|
|
741
738
|
] });
|
|
742
739
|
}
|
|
743
740
|
function Ve({ field: e, api: i }) {
|
|
744
|
-
const r = e.options || [], n = e.fieldType === "boolean", s = e.fieldType === "multitext", o =
|
|
745
|
-
return
|
|
746
|
-
if (r.length >
|
|
747
|
-
const
|
|
748
|
-
|
|
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" });
|
|
749
746
|
}
|
|
750
|
-
|
|
747
|
+
d.current = r.length;
|
|
751
748
|
}, [r.length]), /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
752
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
753
|
-
/* @__PURE__ */ t.jsx("div", { ref: o, className: "mie:space-y-2", children: r.map((
|
|
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: [
|
|
754
751
|
/* @__PURE__ */ t.jsx(
|
|
755
752
|
"input",
|
|
756
753
|
{
|
|
757
754
|
className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent",
|
|
758
|
-
value:
|
|
759
|
-
onChange: (g) => i.option.update(
|
|
760
|
-
placeholder:
|
|
755
|
+
value: h.value,
|
|
756
|
+
onChange: (g) => i.option.update(h.id, g.target.value),
|
|
757
|
+
placeholder: u
|
|
761
758
|
}
|
|
762
759
|
),
|
|
763
760
|
!n && /* @__PURE__ */ t.jsx(
|
|
764
761
|
"button",
|
|
765
762
|
{
|
|
766
|
-
onClick: () => i.option.remove(
|
|
767
|
-
className: "mie:shrink-0 mie:bg-transparent mie:text-
|
|
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",
|
|
768
765
|
title: "Remove option",
|
|
769
766
|
children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
|
|
770
767
|
}
|
|
771
768
|
)
|
|
772
|
-
] },
|
|
769
|
+
] }, h.id)) }),
|
|
773
770
|
!n && /* @__PURE__ */ t.jsxs(
|
|
774
771
|
"button",
|
|
775
772
|
{
|
|
776
773
|
onClick: () => i.option.add(""),
|
|
777
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-
|
|
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",
|
|
778
775
|
children: [
|
|
779
776
|
"+ Add ",
|
|
780
|
-
|
|
777
|
+
c
|
|
781
778
|
]
|
|
782
779
|
}
|
|
783
780
|
)
|
|
784
781
|
] });
|
|
785
782
|
}
|
|
786
783
|
function He({ field: e, api: i }) {
|
|
787
|
-
const r = e.rows || [], n = e.columns || [], s =
|
|
788
|
-
return
|
|
789
|
-
if (r.length >
|
|
790
|
-
const
|
|
791
|
-
|
|
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" });
|
|
792
789
|
}
|
|
793
|
-
|
|
794
|
-
}, [r.length]),
|
|
795
|
-
if (n.length >
|
|
796
|
-
const
|
|
797
|
-
|
|
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" });
|
|
798
795
|
}
|
|
799
|
-
|
|
796
|
+
m.current = n.length;
|
|
800
797
|
}, [n.length]), /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-4", children: [
|
|
801
798
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
802
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
803
|
-
/* @__PURE__ */ t.jsx("div", { ref: s, className: "mie:space-y-2", children: r.map((
|
|
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: [
|
|
804
801
|
/* @__PURE__ */ t.jsx(
|
|
805
802
|
"input",
|
|
806
803
|
{
|
|
807
|
-
className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent",
|
|
808
|
-
value:
|
|
809
|
-
onChange: (
|
|
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),
|
|
810
807
|
placeholder: "Row text"
|
|
811
808
|
}
|
|
812
809
|
),
|
|
813
810
|
/* @__PURE__ */ t.jsx(
|
|
814
811
|
"button",
|
|
815
812
|
{
|
|
816
|
-
onClick: () => i.row.remove(
|
|
817
|
-
className: "mie:shrink-0 mie:bg-transparent mie:text-
|
|
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",
|
|
818
815
|
title: "Remove row",
|
|
819
816
|
children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
|
|
820
817
|
}
|
|
821
818
|
)
|
|
822
|
-
] },
|
|
823
|
-
r.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "mie:px-3 mie:py-2 mie:text-sm mie:text-
|
|
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(
|
|
824
821
|
"button",
|
|
825
822
|
{
|
|
826
823
|
onClick: () => i.row.add(""),
|
|
827
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-
|
|
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",
|
|
828
825
|
children: "+ Add Row"
|
|
829
826
|
}
|
|
830
827
|
)
|
|
831
828
|
] }),
|
|
832
829
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
833
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
834
|
-
/* @__PURE__ */ t.jsx("div", { ref: o, className: "mie:space-y-2", children: n.map((
|
|
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: [
|
|
835
832
|
/* @__PURE__ */ t.jsx(
|
|
836
833
|
"input",
|
|
837
834
|
{
|
|
838
|
-
className: "mie:flex-1 mie:min-w-0 mie:outline-none mie:bg-transparent",
|
|
839
|
-
value:
|
|
840
|
-
onChange: (
|
|
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),
|
|
841
838
|
placeholder: "Column text"
|
|
842
839
|
}
|
|
843
840
|
),
|
|
844
841
|
/* @__PURE__ */ t.jsx(
|
|
845
842
|
"button",
|
|
846
843
|
{
|
|
847
|
-
onClick: () => i.column.remove(
|
|
848
|
-
className: "mie:shrink-0 mie:bg-transparent mie:text-
|
|
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",
|
|
849
846
|
title: "Remove column",
|
|
850
847
|
children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-5 mie:h-5" })
|
|
851
848
|
}
|
|
852
849
|
)
|
|
853
|
-
] },
|
|
854
|
-
n.length >= 10 ? /* @__PURE__ */ t.jsx("div", { className: "mie:px-3 mie:py-2 mie:text-sm mie:text-
|
|
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(
|
|
855
852
|
"button",
|
|
856
853
|
{
|
|
857
854
|
onClick: () => i.column.add(""),
|
|
858
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-
|
|
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",
|
|
859
856
|
children: "+ Add Column"
|
|
860
857
|
}
|
|
861
858
|
)
|
|
862
859
|
] })
|
|
863
860
|
] });
|
|
864
861
|
}
|
|
865
|
-
function
|
|
866
|
-
const i = Ne(e.id), r =
|
|
867
|
-
(
|
|
862
|
+
function _t({ f: e }) {
|
|
863
|
+
const i = Ne(e.id), r = l.useCallback(
|
|
864
|
+
(d, m) => i.field.update(d, m),
|
|
868
865
|
[i]
|
|
869
866
|
), n = K[e.fieldType] || {}, s = n.hasOptions || !1, o = n.hasMatrix || !1;
|
|
870
867
|
return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
@@ -874,9 +871,9 @@ function Ft({ f: e }) {
|
|
|
874
871
|
/* @__PURE__ */ t.jsx(
|
|
875
872
|
"input",
|
|
876
873
|
{
|
|
877
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
878
875
|
value: e.answer || "",
|
|
879
|
-
onChange: (
|
|
876
|
+
onChange: (d) => r("answer", d.target.value),
|
|
880
877
|
placeholder: "Default value"
|
|
881
878
|
}
|
|
882
879
|
)
|
|
@@ -885,124 +882,124 @@ function Ft({ f: e }) {
|
|
|
885
882
|
o && /* @__PURE__ */ t.jsx(He, { field: e, api: i })
|
|
886
883
|
] });
|
|
887
884
|
}
|
|
888
|
-
function
|
|
889
|
-
const r = Ne(e.id), n =
|
|
885
|
+
function Dt({ section: e, onActiveChildChange: i }) {
|
|
886
|
+
const r = Ne(e.id), n = l.useContext(Oe), s = B();
|
|
890
887
|
if (!n) throw new Error("Missing FormStoreContext.Provider in the tree");
|
|
891
|
-
const o = Array.isArray(e.fields) ? e.fields : [],
|
|
892
|
-
|
|
893
|
-
g.current !==
|
|
894
|
-
}, [
|
|
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(() => {
|
|
895
892
|
if (!o.length) {
|
|
896
|
-
|
|
893
|
+
u !== null && h(null);
|
|
897
894
|
return;
|
|
898
895
|
}
|
|
899
|
-
o.some((
|
|
900
|
-
}, [o,
|
|
901
|
-
i?.(e.id,
|
|
902
|
-
}, [e.id,
|
|
903
|
-
const
|
|
904
|
-
(
|
|
905
|
-
|
|
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);
|
|
906
903
|
},
|
|
907
904
|
[e.id, s.selectedChildId]
|
|
908
|
-
),
|
|
909
|
-
(
|
|
905
|
+
), L = l.useCallback((x) => x.question?.trim() || K[x.fieldType]?.label || "Untitled", []), _ = l.useCallback(
|
|
906
|
+
(x, f) => r.field.update(x, f),
|
|
910
907
|
[r]
|
|
911
|
-
),
|
|
912
|
-
() => o.find((
|
|
913
|
-
[o,
|
|
914
|
-
),
|
|
915
|
-
(
|
|
916
|
-
if (
|
|
917
|
-
if (
|
|
918
|
-
const
|
|
919
|
-
if (!
|
|
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();
|
|
916
|
+
if (!T) return;
|
|
920
917
|
n.getState().updateField(
|
|
921
|
-
|
|
922
|
-
{ id:
|
|
918
|
+
N.id,
|
|
919
|
+
{ id: T },
|
|
923
920
|
{
|
|
924
921
|
sectionId: e.id,
|
|
925
|
-
onIdChange: (
|
|
926
|
-
|
|
922
|
+
onIdChange: (w, k) => {
|
|
923
|
+
h((P) => P === k ? w : P);
|
|
927
924
|
}
|
|
928
925
|
}
|
|
929
926
|
);
|
|
930
927
|
return;
|
|
931
928
|
}
|
|
932
929
|
n.getState().updateField(
|
|
933
|
-
|
|
934
|
-
{ [
|
|
930
|
+
N.id,
|
|
931
|
+
{ [x]: f },
|
|
935
932
|
{ sectionId: e.id }
|
|
936
933
|
);
|
|
937
934
|
}
|
|
938
935
|
},
|
|
939
|
-
[
|
|
940
|
-
),
|
|
941
|
-
|
|
942
|
-
}, [
|
|
943
|
-
() =>
|
|
944
|
-
[
|
|
945
|
-
),
|
|
946
|
-
() =>
|
|
947
|
-
[
|
|
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]
|
|
948
945
|
);
|
|
949
946
|
return /* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-4", children: [
|
|
950
947
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
951
|
-
/* @__PURE__ */ t.jsx("h3", { className: "mie:text-sm mie:font-semibold mie:text-
|
|
948
|
+
/* @__PURE__ */ t.jsx("h3", { className: "mie:text-sm mie:font-semibold mie:text-mietext mie:uppercase mie:tracking-wide", children: "Section Properties" }),
|
|
952
949
|
/* @__PURE__ */ t.jsx(
|
|
953
950
|
ze,
|
|
954
951
|
{
|
|
955
952
|
id: e.id,
|
|
956
|
-
onCommit: (
|
|
953
|
+
onCommit: (x) => r.field.renameId(x)
|
|
957
954
|
}
|
|
958
955
|
),
|
|
959
956
|
/* @__PURE__ */ t.jsxs("div", { className: "section-editor-title", children: [
|
|
960
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
957
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext mie:mb-1", children: "Section Title" }),
|
|
961
958
|
/* @__PURE__ */ t.jsx(
|
|
962
959
|
"input",
|
|
963
960
|
{
|
|
964
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
965
962
|
value: e.title || "",
|
|
966
|
-
onChange: (
|
|
963
|
+
onChange: (x) => _("title", x.target.value),
|
|
967
964
|
placeholder: "e.g., Patient Information"
|
|
968
965
|
}
|
|
969
966
|
)
|
|
970
967
|
] })
|
|
971
968
|
] }),
|
|
972
969
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
973
|
-
/* @__PURE__ */ t.jsxs("h3", { className: "mie:text-sm mie:font-semibold mie:text-
|
|
970
|
+
/* @__PURE__ */ t.jsxs("h3", { className: "mie:text-sm mie:font-semibold mie:text-mietext mie:uppercase mie:tracking-wide", children: [
|
|
974
971
|
"Fields (",
|
|
975
972
|
o.length,
|
|
976
973
|
")"
|
|
977
974
|
] }),
|
|
978
|
-
o.length === 0 ? /* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:flex-col mie:items-center mie:justify-center mie:p-6 mie:bg-
|
|
979
|
-
/* @__PURE__ */ t.jsx("p", { className: "mie:text-sm mie:text-
|
|
980
|
-
/* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-
|
|
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" })
|
|
981
978
|
] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
982
979
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:relative", children: [
|
|
983
980
|
/* @__PURE__ */ t.jsx(
|
|
984
981
|
"select",
|
|
985
982
|
{
|
|
986
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:pr-10 mie:border mie:border-
|
|
987
|
-
value:
|
|
988
|
-
onChange: (
|
|
989
|
-
children: o.map((
|
|
990
|
-
|
|
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),
|
|
991
988
|
" — ",
|
|
992
|
-
K[
|
|
993
|
-
] },
|
|
989
|
+
K[x.fieldType]?.label
|
|
990
|
+
] }, x.id))
|
|
994
991
|
}
|
|
995
992
|
),
|
|
996
|
-
/* @__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-
|
|
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" })
|
|
997
994
|
] }),
|
|
998
|
-
|
|
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: [
|
|
999
996
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:justify-between", children: [
|
|
1000
|
-
/* @__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-
|
|
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 }),
|
|
1001
998
|
/* @__PURE__ */ t.jsxs(
|
|
1002
999
|
"button",
|
|
1003
1000
|
{
|
|
1004
|
-
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-
|
|
1005
|
-
onClick:
|
|
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,
|
|
1006
1003
|
title: "Delete this field",
|
|
1007
1004
|
children: [
|
|
1008
1005
|
/* @__PURE__ */ t.jsx(re, { className: "mie:w-3.5 mie:h-3.5" }),
|
|
@@ -1011,21 +1008,21 @@ function _t({ section: e, onActiveChildChange: i }) {
|
|
|
1011
1008
|
}
|
|
1012
1009
|
)
|
|
1013
1010
|
] }),
|
|
1014
|
-
/* @__PURE__ */ t.jsx(We, { f:
|
|
1015
|
-
|
|
1016
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
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" }),
|
|
1017
1014
|
/* @__PURE__ */ t.jsx(
|
|
1018
1015
|
"input",
|
|
1019
1016
|
{
|
|
1020
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
1021
|
-
value:
|
|
1022
|
-
onChange: (
|
|
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),
|
|
1023
1020
|
placeholder: "Default value"
|
|
1024
1021
|
}
|
|
1025
1022
|
)
|
|
1026
1023
|
] }),
|
|
1027
|
-
|
|
1028
|
-
|
|
1024
|
+
S && R && /* @__PURE__ */ t.jsx(Ve, { field: N, api: R }),
|
|
1025
|
+
b && R && /* @__PURE__ */ t.jsx(He, { field: N, api: R })
|
|
1029
1026
|
] })
|
|
1030
1027
|
] })
|
|
1031
1028
|
] })
|
|
@@ -1033,7 +1030,7 @@ function _t({ section: e, onActiveChildChange: i }) {
|
|
|
1033
1030
|
}
|
|
1034
1031
|
function Re(e, i, r) {
|
|
1035
1032
|
if (e === "expression")
|
|
1036
|
-
return
|
|
1033
|
+
return xt.includes(i) ? ["equals", "notEquals", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual"] : ["equals", "notEquals", "contains", "empty", "notEmpty"];
|
|
1037
1034
|
switch (e) {
|
|
1038
1035
|
case "text":
|
|
1039
1036
|
case "longtext":
|
|
@@ -1053,7 +1050,7 @@ function Re(e, i, r) {
|
|
|
1053
1050
|
return ["equals", "notEquals"];
|
|
1054
1051
|
}
|
|
1055
1052
|
}
|
|
1056
|
-
function
|
|
1053
|
+
function Lt(e) {
|
|
1057
1054
|
switch (e) {
|
|
1058
1055
|
case "check":
|
|
1059
1056
|
case "multiselectdropdown":
|
|
@@ -1100,113 +1097,113 @@ function Ae(e) {
|
|
|
1100
1097
|
const i = String(e ?? "");
|
|
1101
1098
|
return { id: i, value: i };
|
|
1102
1099
|
}
|
|
1103
|
-
function
|
|
1100
|
+
function $t() {
|
|
1104
1101
|
const e = B(), i = V((p) => p.byId), r = V((p) => p.setEnableWhen), n = V((p) => p.updateField), s = e?.selectedFieldId?.value ?? null;
|
|
1105
1102
|
e?.selectedChildId?.ParentId;
|
|
1106
|
-
const o = e?.selectedChildId?.ChildId ?? null,
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
}, [
|
|
1110
|
-
const
|
|
1111
|
-
if (
|
|
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)
|
|
1112
1109
|
if (p && p.startsWith("child:")) {
|
|
1113
|
-
const
|
|
1114
|
-
e.selectedChildId.set(s,
|
|
1110
|
+
const C = p.slice(6);
|
|
1111
|
+
e.selectedChildId.set(s, C);
|
|
1115
1112
|
} else
|
|
1116
1113
|
e.selectedChildId.set(null, null);
|
|
1117
|
-
}, [
|
|
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(() => {
|
|
1118
1115
|
const p = [];
|
|
1119
|
-
for (const
|
|
1120
|
-
if (
|
|
1121
|
-
if (
|
|
1122
|
-
const
|
|
1123
|
-
|
|
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) => {
|
|
1124
1121
|
p.push({
|
|
1125
|
-
id:
|
|
1126
|
-
parentId:
|
|
1127
|
-
label: `${
|
|
1128
|
-
fieldType:
|
|
1129
|
-
displayFormat:
|
|
1130
|
-
options: Array.isArray(
|
|
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 : []
|
|
1131
1128
|
});
|
|
1132
1129
|
});
|
|
1133
1130
|
} else
|
|
1134
1131
|
p.push({
|
|
1135
|
-
id:
|
|
1132
|
+
id: C.id,
|
|
1136
1133
|
parentId: null,
|
|
1137
|
-
label:
|
|
1138
|
-
fieldType:
|
|
1139
|
-
displayFormat:
|
|
1140
|
-
options: Array.isArray(
|
|
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 : []
|
|
1141
1138
|
});
|
|
1142
1139
|
return p;
|
|
1143
|
-
}, [i]),
|
|
1144
|
-
(p) =>
|
|
1145
|
-
[
|
|
1146
|
-
),
|
|
1140
|
+
}, [i]), I = l.useCallback(
|
|
1141
|
+
(p) => j.find((C) => C.id === p) || null,
|
|
1142
|
+
[j]
|
|
1143
|
+
), S = l.useCallback(
|
|
1147
1144
|
(p) => {
|
|
1148
|
-
if (!
|
|
1149
|
-
const
|
|
1150
|
-
|
|
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);
|
|
1151
1148
|
},
|
|
1152
|
-
[
|
|
1153
|
-
),
|
|
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(() => {
|
|
1154
1151
|
const p = {
|
|
1155
|
-
logic:
|
|
1152
|
+
logic: b.logic || "AND",
|
|
1156
1153
|
conditions: [
|
|
1157
|
-
...Array.isArray(
|
|
1154
|
+
...Array.isArray(b.conditions) ? b.conditions : [],
|
|
1158
1155
|
{ targetId: "", operator: "equals", value: "" }
|
|
1159
1156
|
]
|
|
1160
1157
|
};
|
|
1161
|
-
|
|
1162
|
-
}, [
|
|
1158
|
+
S(p);
|
|
1159
|
+
}, [b, S]), f = l.useCallback(() => S(null), [S]), T = l.useCallback(
|
|
1163
1160
|
(p) => {
|
|
1164
|
-
const
|
|
1165
|
-
|
|
1161
|
+
const M = (Array.isArray(b.conditions) ? b.conditions : []).filter((E, F) => F !== p);
|
|
1162
|
+
S({ ...b, conditions: M });
|
|
1166
1163
|
},
|
|
1167
|
-
[
|
|
1168
|
-
),
|
|
1169
|
-
(p,
|
|
1170
|
-
const
|
|
1171
|
-
if ("targetId" in
|
|
1172
|
-
const
|
|
1173
|
-
H.includes(
|
|
1174
|
-
const Y = Array.isArray(
|
|
1175
|
-
Y.length > 0 && (new Set(Y.map((
|
|
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 = ""));
|
|
1176
1173
|
}
|
|
1177
|
-
|
|
1174
|
+
E[p] = $, S({ ...b, conditions: E });
|
|
1178
1175
|
},
|
|
1179
|
-
[
|
|
1180
|
-
),
|
|
1181
|
-
() =>
|
|
1182
|
-
[
|
|
1183
|
-
),
|
|
1176
|
+
[b, I, S]
|
|
1177
|
+
), k = l.useMemo(
|
|
1178
|
+
() => j.filter((p) => p.id !== O),
|
|
1179
|
+
[j, O]
|
|
1180
|
+
), P = !R || !O;
|
|
1184
1181
|
return /* @__PURE__ */ t.jsxs("div", { className: "logic-editor-container mie:space-y-4", children: [
|
|
1185
|
-
|
|
1186
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
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" }),
|
|
1187
1184
|
/* @__PURE__ */ t.jsxs(
|
|
1188
1185
|
"select",
|
|
1189
1186
|
{
|
|
1190
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
1191
1188
|
value: g,
|
|
1192
|
-
onChange: (p) =>
|
|
1189
|
+
onChange: (p) => L(p.target.value),
|
|
1193
1190
|
children: [
|
|
1194
1191
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "Section (this)" }),
|
|
1195
|
-
|
|
1192
|
+
c.map((p) => /* @__PURE__ */ t.jsx("option", { value: `child:${p.id}`, children: p.question?.trim() || p.title?.trim() || p.id }, p.id))
|
|
1196
1193
|
]
|
|
1197
1194
|
}
|
|
1198
1195
|
)
|
|
1199
1196
|
] }),
|
|
1200
1197
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-3", children: [
|
|
1201
1198
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-2", children: [
|
|
1202
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-
|
|
1199
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-sm mie:font-medium mie:text-mietext", children: "Logic Operator" }),
|
|
1203
1200
|
/* @__PURE__ */ t.jsxs(
|
|
1204
1201
|
"select",
|
|
1205
1202
|
{
|
|
1206
|
-
value:
|
|
1207
|
-
onChange: (p) =>
|
|
1208
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
1209
|
-
disabled:
|
|
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,
|
|
1210
1207
|
children: [
|
|
1211
1208
|
/* @__PURE__ */ t.jsx("option", { value: "AND", children: "AND — All conditions must be true" }),
|
|
1212
1209
|
/* @__PURE__ */ t.jsx("option", { value: "OR", children: "OR — Any condition must be true" })
|
|
@@ -1219,9 +1216,9 @@ function Lt() {
|
|
|
1219
1216
|
"button",
|
|
1220
1217
|
{
|
|
1221
1218
|
type: "button",
|
|
1222
|
-
className: "mie:flex-1 mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-
|
|
1223
|
-
onClick:
|
|
1224
|
-
disabled:
|
|
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,
|
|
1225
1222
|
children: "+ Add Condition"
|
|
1226
1223
|
}
|
|
1227
1224
|
),
|
|
@@ -1229,157 +1226,157 @@ function Lt() {
|
|
|
1229
1226
|
"button",
|
|
1230
1227
|
{
|
|
1231
1228
|
type: "button",
|
|
1232
|
-
className: "mie:px-3 mie:py-2 mie:text-sm mie:font-medium mie:bg-
|
|
1233
|
-
onClick:
|
|
1234
|
-
disabled:
|
|
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,
|
|
1235
1232
|
children: "Clear All"
|
|
1236
1233
|
}
|
|
1237
1234
|
)
|
|
1238
1235
|
] })
|
|
1239
1236
|
] }),
|
|
1240
|
-
|
|
1241
|
-
/* @__PURE__ */ t.jsxs("h4", { className: "mie:text-sm mie:font-medium mie:text-
|
|
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: [
|
|
1242
1239
|
"Conditions (",
|
|
1243
|
-
|
|
1240
|
+
b.conditions.length,
|
|
1244
1241
|
")"
|
|
1245
1242
|
] }),
|
|
1246
|
-
/* @__PURE__ */ t.jsx("div", { className: "mie:space-y-3", children:
|
|
1247
|
-
const
|
|
1248
|
-
return /* @__PURE__ */ t.jsxs("div", { className: "mie:p-3 mie:bg-
|
|
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: [
|
|
1249
1246
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:justify-between mie:mb-2", children: [
|
|
1250
|
-
/* @__PURE__ */ t.jsxs("span", { className: "mie:text-xs mie:font-semibold mie:text-
|
|
1247
|
+
/* @__PURE__ */ t.jsxs("span", { className: "mie:text-xs mie:font-semibold mie:text-mietextmuted mie:uppercase mie:tracking-wide", children: [
|
|
1251
1248
|
"Condition ",
|
|
1252
|
-
|
|
1249
|
+
C + 1
|
|
1253
1250
|
] }),
|
|
1254
1251
|
/* @__PURE__ */ t.jsx(
|
|
1255
1252
|
"button",
|
|
1256
1253
|
{
|
|
1257
1254
|
type: "button",
|
|
1258
|
-
onClick: () =>
|
|
1259
|
-
className: "mie:bg-transparent mie:text-
|
|
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",
|
|
1260
1257
|
title: "Remove condition",
|
|
1261
|
-
disabled:
|
|
1258
|
+
disabled: P,
|
|
1262
1259
|
children: /* @__PURE__ */ t.jsx(re, { className: "mie:w-4 mie:h-4" })
|
|
1263
1260
|
}
|
|
1264
1261
|
)
|
|
1265
1262
|
] }),
|
|
1266
1263
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:space-y-2", children: [
|
|
1267
1264
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1268
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-
|
|
1265
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "When Field" }),
|
|
1269
1266
|
/* @__PURE__ */ t.jsxs(
|
|
1270
1267
|
"select",
|
|
1271
1268
|
{
|
|
1272
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
1273
1270
|
value: p.targetId,
|
|
1274
|
-
onChange: (
|
|
1275
|
-
disabled:
|
|
1271
|
+
onChange: (y) => w(C, { targetId: y.target.value }),
|
|
1272
|
+
disabled: P,
|
|
1276
1273
|
children: [
|
|
1277
1274
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select field —" }),
|
|
1278
|
-
|
|
1275
|
+
k.map((y) => /* @__PURE__ */ t.jsx("option", { value: y.id, children: y.label }, y.id))
|
|
1279
1276
|
]
|
|
1280
1277
|
}
|
|
1281
1278
|
)
|
|
1282
1279
|
] }),
|
|
1283
|
-
|
|
1284
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-
|
|
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)" }),
|
|
1285
1282
|
/* @__PURE__ */ t.jsxs(
|
|
1286
1283
|
"select",
|
|
1287
1284
|
{
|
|
1288
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
1289
1286
|
value: p.propertyAccessor || "",
|
|
1290
|
-
onChange: (
|
|
1291
|
-
disabled:
|
|
1287
|
+
onChange: (y) => w(C, { propertyAccessor: y.target.value || void 0 }),
|
|
1288
|
+
disabled: P || !M,
|
|
1292
1289
|
children: [
|
|
1293
1290
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Direct value —" }),
|
|
1294
|
-
|
|
1291
|
+
F.map((y) => /* @__PURE__ */ t.jsxs("option", { value: y, children: [
|
|
1295
1292
|
".",
|
|
1296
|
-
|
|
1293
|
+
y,
|
|
1297
1294
|
" (get ",
|
|
1298
|
-
|
|
1295
|
+
y,
|
|
1299
1296
|
")"
|
|
1300
|
-
] },
|
|
1297
|
+
] }, y))
|
|
1301
1298
|
]
|
|
1302
1299
|
}
|
|
1303
1300
|
),
|
|
1304
|
-
/* @__PURE__ */ t.jsx("p", { className: "mie:text-xs mie:text-
|
|
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" })
|
|
1305
1302
|
] }),
|
|
1306
1303
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:grid mie:grid-cols-2 mie:gap-2", children: [
|
|
1307
1304
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1308
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-
|
|
1305
|
+
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-mietextmuted mie:mb-1", children: "Operator" }),
|
|
1309
1306
|
/* @__PURE__ */ t.jsx(
|
|
1310
1307
|
"select",
|
|
1311
1308
|
{
|
|
1312
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
1313
1310
|
value: p.operator,
|
|
1314
|
-
onChange: (
|
|
1315
|
-
disabled:
|
|
1316
|
-
children: (
|
|
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))
|
|
1317
1314
|
}
|
|
1318
1315
|
)
|
|
1319
1316
|
] }),
|
|
1320
1317
|
/* @__PURE__ */ t.jsxs("div", { children: [
|
|
1321
|
-
/* @__PURE__ */ t.jsx("label", { className: "mie:block mie:text-xs mie:font-medium mie:text-
|
|
1322
|
-
Y ? H && !p.propertyAccessor && !
|
|
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(
|
|
1323
1320
|
"select",
|
|
1324
1321
|
{
|
|
1325
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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",
|
|
1326
1323
|
value: p.value,
|
|
1327
|
-
onChange: (
|
|
1328
|
-
disabled:
|
|
1324
|
+
onChange: (y) => w(C, { value: y.target.value }),
|
|
1325
|
+
disabled: P || !M,
|
|
1329
1326
|
children: [
|
|
1330
1327
|
/* @__PURE__ */ t.jsx("option", { value: "", children: "— Select option —" }),
|
|
1331
|
-
|
|
1328
|
+
z.map((y) => /* @__PURE__ */ t.jsx("option", { value: y.id, children: y.value }, y.id))
|
|
1332
1329
|
]
|
|
1333
1330
|
}
|
|
1334
1331
|
) : /* @__PURE__ */ t.jsx(
|
|
1335
1332
|
"input",
|
|
1336
1333
|
{
|
|
1337
|
-
className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
1338
|
-
placeholder: p.propertyAccessor ||
|
|
1339
|
-
type: p.propertyAccessor ||
|
|
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",
|
|
1340
1337
|
value: p.value,
|
|
1341
|
-
onChange: (
|
|
1342
|
-
disabled:
|
|
1338
|
+
onChange: (y) => w(C, { value: y.target.value }),
|
|
1339
|
+
disabled: P || !M
|
|
1343
1340
|
}
|
|
1344
|
-
) : /* @__PURE__ */ t.jsx("div", { className: "mie:w-full mie:px-3 mie:py-2 mie:border mie:border-
|
|
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)" })
|
|
1345
1342
|
] })
|
|
1346
1343
|
] })
|
|
1347
1344
|
] })
|
|
1348
|
-
] },
|
|
1345
|
+
] }, C);
|
|
1349
1346
|
}) })
|
|
1350
1347
|
] })
|
|
1351
1348
|
] });
|
|
1352
1349
|
}
|
|
1353
1350
|
function Pe({ isMobileModal: e = !1 }) {
|
|
1354
1351
|
const i = B(), r = V(
|
|
1355
|
-
|
|
1356
|
-
(
|
|
1352
|
+
l.useCallback(
|
|
1353
|
+
(c) => i.selectedFieldId.value ? c.byId[i.selectedFieldId.value] : null,
|
|
1357
1354
|
[i.selectedFieldId.value]
|
|
1358
1355
|
)
|
|
1359
|
-
), [n, s] =
|
|
1360
|
-
(
|
|
1361
|
-
i.selectedChildId.set(
|
|
1356
|
+
), [n, s] = l.useState("EDIT"), o = l.useCallback(
|
|
1357
|
+
(c, u) => {
|
|
1358
|
+
i.selectedChildId.set(c, u);
|
|
1362
1359
|
},
|
|
1363
1360
|
[i.selectedChildId.set]
|
|
1364
1361
|
);
|
|
1365
|
-
if (
|
|
1362
|
+
if (l.useEffect(() => {
|
|
1366
1363
|
i.selectedChildId.set(null, null), s("EDIT");
|
|
1367
1364
|
}, [i.selectedFieldId.value]), i.state.isPreview) return null;
|
|
1368
|
-
const
|
|
1365
|
+
const d = !r, m = r?.fieldType === "section";
|
|
1369
1366
|
return /* @__PURE__ */ t.jsxs(
|
|
1370
1367
|
"div",
|
|
1371
1368
|
{
|
|
1372
|
-
className: `edit-panel-container mie:bg-
|
|
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)]"}`,
|
|
1373
1370
|
children: [
|
|
1374
|
-
/* @__PURE__ */ t.jsx("div", { className: "mie:sticky mie:top-0 mie:z-20 mie:bg-
|
|
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: [
|
|
1375
1372
|
/* @__PURE__ */ t.jsxs(
|
|
1376
1373
|
"button",
|
|
1377
1374
|
{
|
|
1378
1375
|
type: "button",
|
|
1379
1376
|
onClick: () => s("EDIT"),
|
|
1380
|
-
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 ${n === "EDIT" ? "mie:bg-
|
|
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"}`,
|
|
1381
1378
|
children: [
|
|
1382
|
-
/* @__PURE__ */ t.jsx(
|
|
1379
|
+
/* @__PURE__ */ t.jsx(bt, { className: "mie:w-4 mie:h-4" }),
|
|
1383
1380
|
/* @__PURE__ */ t.jsx("span", { children: "Edit" })
|
|
1384
1381
|
]
|
|
1385
1382
|
}
|
|
@@ -1389,39 +1386,39 @@ function Pe({ isMobileModal: e = !1 }) {
|
|
|
1389
1386
|
{
|
|
1390
1387
|
type: "button",
|
|
1391
1388
|
onClick: () => s("LOGIC"),
|
|
1392
|
-
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 ${n === "LOGIC" ? "mie:bg-
|
|
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"}`,
|
|
1393
1390
|
children: [
|
|
1394
|
-
/* @__PURE__ */ t.jsx(
|
|
1391
|
+
/* @__PURE__ */ t.jsx(gt, { className: "mie:w-4 mie:h-4" }),
|
|
1395
1392
|
/* @__PURE__ */ t.jsx("span", { children: "Logic" })
|
|
1396
1393
|
]
|
|
1397
1394
|
}
|
|
1398
1395
|
)
|
|
1399
1396
|
] }) }),
|
|
1400
1397
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:p-4", children: [
|
|
1401
|
-
|
|
1402
|
-
!
|
|
1403
|
-
!
|
|
1404
|
-
|
|
1405
|
-
|
|
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,
|
|
1406
1403
|
{
|
|
1407
1404
|
section: r,
|
|
1408
1405
|
onActiveChildChange: o
|
|
1409
1406
|
}
|
|
1410
1407
|
)
|
|
1411
1408
|
] }),
|
|
1412
|
-
!
|
|
1409
|
+
!d && n === "LOGIC" && /* @__PURE__ */ t.jsx($t, {})
|
|
1413
1410
|
] })
|
|
1414
1411
|
]
|
|
1415
1412
|
}
|
|
1416
1413
|
);
|
|
1417
1414
|
}
|
|
1418
|
-
function
|
|
1419
|
-
const e = B(), { fields: i } =
|
|
1420
|
-
return
|
|
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(() => {
|
|
1421
1418
|
if (!e.state.isPreview) {
|
|
1422
1419
|
if (n.length > o.current) {
|
|
1423
|
-
const
|
|
1424
|
-
|
|
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));
|
|
1425
1422
|
}
|
|
1426
1423
|
o.current = n.length;
|
|
1427
1424
|
}
|
|
@@ -1433,36 +1430,36 @@ function $t() {
|
|
|
1433
1430
|
${e.state.isPreview ? "mie:max-w-4xl" : "mie:max-w-xl"}
|
|
1434
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`,
|
|
1435
1432
|
onClick: () => !e.state.isPreview && e.selectedFieldId.clear(),
|
|
1436
|
-
children:
|
|
1433
|
+
children: d.length === 0 ? /* @__PURE__ */ t.jsx(Wt, {}) : d.map((m) => /* @__PURE__ */ t.jsx(zt, { id: m }, m))
|
|
1437
1434
|
}
|
|
1438
1435
|
);
|
|
1439
1436
|
}
|
|
1440
|
-
const
|
|
1441
|
-
const r = V(
|
|
1437
|
+
const zt = l.memo(function({ id: i }) {
|
|
1438
|
+
const r = V(l.useCallback((s) => s.byId[i], [i]));
|
|
1442
1439
|
if (!r) return null;
|
|
1443
|
-
const n =
|
|
1440
|
+
const n = jt(r.fieldType);
|
|
1444
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;
|
|
1445
1442
|
});
|
|
1446
|
-
function
|
|
1443
|
+
function Wt() {
|
|
1447
1444
|
return /* @__PURE__ */ t.jsxs(
|
|
1448
1445
|
"div",
|
|
1449
1446
|
{
|
|
1450
|
-
className: "form-builder-empty-state mie:flex mie:flex-col mie:items-center mie:justify-center mie:h-72 mie:bg-
|
|
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",
|
|
1451
1448
|
children: [
|
|
1452
|
-
/* @__PURE__ */ t.jsx("div", { className: "empty-state-title mie:text-xl mie:font-semibold mie:text-
|
|
1453
|
-
/* @__PURE__ */ t.jsxs("div", { className: "empty-state-description mie:text-base mie:text-
|
|
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: [
|
|
1454
1451
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:lg:hidden", children: [
|
|
1455
1452
|
"Tap the ",
|
|
1456
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-
|
|
1453
|
+
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Tool Panel" }),
|
|
1457
1454
|
" button to add fields."
|
|
1458
1455
|
] }),
|
|
1459
1456
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:hidden mie:lg:block", children: [
|
|
1460
1457
|
"Add fields using the ",
|
|
1461
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-
|
|
1458
|
+
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Tool Panel" }),
|
|
1462
1459
|
" on the left.",
|
|
1463
1460
|
/* @__PURE__ */ t.jsx("br", {}),
|
|
1464
1461
|
"Edit field properties using the ",
|
|
1465
|
-
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-
|
|
1462
|
+
/* @__PURE__ */ t.jsx("span", { className: "mie:font-semibold mie:text-mieprimary", children: "Edit Panel" }),
|
|
1466
1463
|
" on the right."
|
|
1467
1464
|
] })
|
|
1468
1465
|
] })
|
|
@@ -1475,36 +1472,36 @@ function Me(e, i) {
|
|
|
1475
1472
|
for (var r = 0, n = Array(i); r < i; r++) n[r] = e[r];
|
|
1476
1473
|
return n;
|
|
1477
1474
|
}
|
|
1478
|
-
function
|
|
1475
|
+
function Vt(e) {
|
|
1479
1476
|
if (Array.isArray(e)) return e;
|
|
1480
1477
|
}
|
|
1481
|
-
function
|
|
1482
|
-
return (i =
|
|
1478
|
+
function Ht(e, i, r) {
|
|
1479
|
+
return (i = Qt(i)) in e ? Object.defineProperty(e, i, {
|
|
1483
1480
|
value: r,
|
|
1484
1481
|
enumerable: !0,
|
|
1485
1482
|
configurable: !0,
|
|
1486
1483
|
writable: !0
|
|
1487
1484
|
}) : e[i] = r, e;
|
|
1488
1485
|
}
|
|
1489
|
-
function
|
|
1486
|
+
function Yt(e, i) {
|
|
1490
1487
|
var r = e == null ? null : typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
|
|
1491
1488
|
if (r != null) {
|
|
1492
|
-
var n, s, o,
|
|
1489
|
+
var n, s, o, d, m = [], c = !0, u = !1;
|
|
1493
1490
|
try {
|
|
1494
|
-
if (o = (r = r.call(e)).next, i !== 0) for (; !(
|
|
1495
|
-
} catch (
|
|
1496
|
-
|
|
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;
|
|
1497
1494
|
} finally {
|
|
1498
1495
|
try {
|
|
1499
|
-
if (!
|
|
1496
|
+
if (!c && r.return != null && (d = r.return(), Object(d) !== d)) return;
|
|
1500
1497
|
} finally {
|
|
1501
|
-
if (
|
|
1498
|
+
if (u) throw s;
|
|
1502
1499
|
}
|
|
1503
1500
|
}
|
|
1504
|
-
return
|
|
1501
|
+
return m;
|
|
1505
1502
|
}
|
|
1506
1503
|
}
|
|
1507
|
-
function
|
|
1504
|
+
function Jt() {
|
|
1508
1505
|
throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
1509
1506
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
|
|
1510
1507
|
}
|
|
@@ -1522,23 +1519,23 @@ function _e(e) {
|
|
|
1522
1519
|
for (var i = 1; i < arguments.length; i++) {
|
|
1523
1520
|
var r = arguments[i] != null ? arguments[i] : {};
|
|
1524
1521
|
i % 2 ? Fe(Object(r), !0).forEach(function(n) {
|
|
1525
|
-
|
|
1522
|
+
Ht(e, n, r[n]);
|
|
1526
1523
|
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Fe(Object(r)).forEach(function(n) {
|
|
1527
1524
|
Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
|
|
1528
1525
|
});
|
|
1529
1526
|
}
|
|
1530
1527
|
return e;
|
|
1531
1528
|
}
|
|
1532
|
-
function
|
|
1529
|
+
function Bt(e, i) {
|
|
1533
1530
|
if (e == null) return {};
|
|
1534
|
-
var r, n, s =
|
|
1531
|
+
var r, n, s = Gt(e, i);
|
|
1535
1532
|
if (Object.getOwnPropertySymbols) {
|
|
1536
1533
|
var o = Object.getOwnPropertySymbols(e);
|
|
1537
1534
|
for (n = 0; n < o.length; n++) r = o[n], i.indexOf(r) === -1 && {}.propertyIsEnumerable.call(e, r) && (s[r] = e[r]);
|
|
1538
1535
|
}
|
|
1539
1536
|
return s;
|
|
1540
1537
|
}
|
|
1541
|
-
function
|
|
1538
|
+
function Gt(e, i) {
|
|
1542
1539
|
if (e == null) return {};
|
|
1543
1540
|
var r = {};
|
|
1544
1541
|
for (var n in e) if ({}.hasOwnProperty.call(e, n)) {
|
|
@@ -1547,10 +1544,10 @@ function Bt(e, i) {
|
|
|
1547
1544
|
}
|
|
1548
1545
|
return r;
|
|
1549
1546
|
}
|
|
1550
|
-
function Gt(e, i) {
|
|
1551
|
-
return Wt(e) || Ht(e, i) || Qt(e, i) || Yt();
|
|
1552
|
-
}
|
|
1553
1547
|
function Kt(e, i) {
|
|
1548
|
+
return Vt(e) || Yt(e, i) || Zt(e, i) || Jt();
|
|
1549
|
+
}
|
|
1550
|
+
function Xt(e, i) {
|
|
1554
1551
|
if (typeof e != "object" || !e) return e;
|
|
1555
1552
|
var r = e[Symbol.toPrimitive];
|
|
1556
1553
|
if (r !== void 0) {
|
|
@@ -1560,18 +1557,18 @@ function Kt(e, i) {
|
|
|
1560
1557
|
}
|
|
1561
1558
|
return (i === "string" ? String : Number)(e);
|
|
1562
1559
|
}
|
|
1563
|
-
function
|
|
1564
|
-
var i =
|
|
1560
|
+
function Qt(e) {
|
|
1561
|
+
var i = Xt(e, "string");
|
|
1565
1562
|
return typeof i == "symbol" ? i : i + "";
|
|
1566
1563
|
}
|
|
1567
|
-
function
|
|
1564
|
+
function Zt(e, i) {
|
|
1568
1565
|
if (e) {
|
|
1569
1566
|
if (typeof e == "string") return Me(e, i);
|
|
1570
1567
|
var r = {}.toString.call(e).slice(8, -1);
|
|
1571
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;
|
|
1572
1569
|
}
|
|
1573
1570
|
}
|
|
1574
|
-
function
|
|
1571
|
+
function ei(e, i, r) {
|
|
1575
1572
|
return i in e ? Object.defineProperty(e, i, {
|
|
1576
1573
|
value: r,
|
|
1577
1574
|
enumerable: !0,
|
|
@@ -1589,18 +1586,18 @@ function De(e, i) {
|
|
|
1589
1586
|
}
|
|
1590
1587
|
return r;
|
|
1591
1588
|
}
|
|
1592
|
-
function
|
|
1589
|
+
function Le(e) {
|
|
1593
1590
|
for (var i = 1; i < arguments.length; i++) {
|
|
1594
1591
|
var r = arguments[i] != null ? arguments[i] : {};
|
|
1595
1592
|
i % 2 ? De(Object(r), !0).forEach(function(n) {
|
|
1596
|
-
|
|
1593
|
+
ei(e, n, r[n]);
|
|
1597
1594
|
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : De(Object(r)).forEach(function(n) {
|
|
1598
1595
|
Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
|
|
1599
1596
|
});
|
|
1600
1597
|
}
|
|
1601
1598
|
return e;
|
|
1602
1599
|
}
|
|
1603
|
-
function
|
|
1600
|
+
function ti() {
|
|
1604
1601
|
for (var e = arguments.length, i = new Array(e), r = 0; r < e; r++)
|
|
1605
1602
|
i[r] = arguments[r];
|
|
1606
1603
|
return function(n) {
|
|
@@ -1614,44 +1611,44 @@ function te(e) {
|
|
|
1614
1611
|
for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
|
|
1615
1612
|
s[o] = arguments[o];
|
|
1616
1613
|
return s.length >= e.length ? e.apply(this, s) : function() {
|
|
1617
|
-
for (var
|
|
1618
|
-
|
|
1619
|
-
return i.apply(r, [].concat(s,
|
|
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));
|
|
1620
1617
|
};
|
|
1621
1618
|
};
|
|
1622
1619
|
}
|
|
1623
|
-
function
|
|
1620
|
+
function he(e) {
|
|
1624
1621
|
return {}.toString.call(e).includes("Object");
|
|
1625
1622
|
}
|
|
1626
|
-
function
|
|
1623
|
+
function ii(e) {
|
|
1627
1624
|
return !Object.keys(e).length;
|
|
1628
1625
|
}
|
|
1629
1626
|
function ne(e) {
|
|
1630
1627
|
return typeof e == "function";
|
|
1631
1628
|
}
|
|
1632
|
-
function
|
|
1629
|
+
function ri(e, i) {
|
|
1633
1630
|
return Object.prototype.hasOwnProperty.call(e, i);
|
|
1634
1631
|
}
|
|
1635
|
-
function
|
|
1636
|
-
return
|
|
1637
|
-
return !
|
|
1632
|
+
function ni(e, i) {
|
|
1633
|
+
return he(i) || G("changeType"), Object.keys(i).some(function(r) {
|
|
1634
|
+
return !ri(e, r);
|
|
1638
1635
|
}) && G("changeField"), i;
|
|
1639
1636
|
}
|
|
1640
|
-
function
|
|
1637
|
+
function si(e) {
|
|
1641
1638
|
ne(e) || G("selectorType");
|
|
1642
1639
|
}
|
|
1643
|
-
function
|
|
1644
|
-
ne(e) ||
|
|
1640
|
+
function oi(e) {
|
|
1641
|
+
ne(e) || he(e) || G("handlerType"), he(e) && Object.values(e).some(function(i) {
|
|
1645
1642
|
return !ne(i);
|
|
1646
1643
|
}) && G("handlersType");
|
|
1647
1644
|
}
|
|
1648
|
-
function
|
|
1649
|
-
e || G("initialIsRequired"),
|
|
1645
|
+
function ai(e) {
|
|
1646
|
+
e || G("initialIsRequired"), he(e) || G("initialType"), ii(e) && G("initialContent");
|
|
1650
1647
|
}
|
|
1651
|
-
function
|
|
1648
|
+
function mi(e, i) {
|
|
1652
1649
|
throw new Error(e[i] || e.default);
|
|
1653
1650
|
}
|
|
1654
|
-
var
|
|
1651
|
+
var li = {
|
|
1655
1652
|
initialIsRequired: "initial state is required",
|
|
1656
1653
|
initialType: "initial state should be an object",
|
|
1657
1654
|
initialContent: "initial state shouldn't be an empty object",
|
|
@@ -1661,73 +1658,73 @@ var ai = {
|
|
|
1661
1658
|
changeType: "provided value of changes should be an object",
|
|
1662
1659
|
changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
|
|
1663
1660
|
default: "an unknown error accured in `state-local` package"
|
|
1664
|
-
}, G = te(
|
|
1665
|
-
changes:
|
|
1666
|
-
selector:
|
|
1667
|
-
handler:
|
|
1668
|
-
initial:
|
|
1661
|
+
}, G = te(mi)(li), le = {
|
|
1662
|
+
changes: ni,
|
|
1663
|
+
selector: si,
|
|
1664
|
+
handler: oi,
|
|
1665
|
+
initial: ai
|
|
1669
1666
|
};
|
|
1670
1667
|
function ci(e) {
|
|
1671
1668
|
var i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
|
|
1672
|
-
|
|
1669
|
+
le.initial(e), le.handler(i);
|
|
1673
1670
|
var r = {
|
|
1674
1671
|
current: e
|
|
1675
|
-
}, n = te(
|
|
1676
|
-
function
|
|
1677
|
-
var
|
|
1678
|
-
return
|
|
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;
|
|
1679
1676
|
};
|
|
1680
|
-
return
|
|
1677
|
+
return le.selector(u), u(r.current);
|
|
1681
1678
|
}
|
|
1682
|
-
function
|
|
1683
|
-
|
|
1679
|
+
function c(u) {
|
|
1680
|
+
ti(n, s, o, d)(u);
|
|
1684
1681
|
}
|
|
1685
|
-
return [
|
|
1682
|
+
return [m, c];
|
|
1686
1683
|
}
|
|
1687
|
-
function
|
|
1684
|
+
function di(e, i) {
|
|
1688
1685
|
return ne(i) ? i(e.current) : i;
|
|
1689
1686
|
}
|
|
1690
|
-
function
|
|
1691
|
-
return e.current =
|
|
1687
|
+
function ui(e, i) {
|
|
1688
|
+
return e.current = Le(Le({}, e.current), i), i;
|
|
1692
1689
|
}
|
|
1693
|
-
function
|
|
1690
|
+
function fi(e, i, r) {
|
|
1694
1691
|
return ne(i) ? i(e.current) : Object.keys(r).forEach(function(n) {
|
|
1695
1692
|
var s;
|
|
1696
1693
|
return (s = i[n]) === null || s === void 0 ? void 0 : s.call(i, e.current[n]);
|
|
1697
1694
|
}), r;
|
|
1698
1695
|
}
|
|
1699
|
-
var
|
|
1696
|
+
var pi = {
|
|
1700
1697
|
create: ci
|
|
1701
1698
|
}, hi = {
|
|
1702
1699
|
paths: {
|
|
1703
1700
|
vs: "https://cdn.jsdelivr.net/npm/monaco-editor@0.55.1/min/vs"
|
|
1704
1701
|
}
|
|
1705
1702
|
};
|
|
1706
|
-
function
|
|
1703
|
+
function xi(e) {
|
|
1707
1704
|
return function i() {
|
|
1708
1705
|
for (var r = this, n = arguments.length, s = new Array(n), o = 0; o < n; o++)
|
|
1709
1706
|
s[o] = arguments[o];
|
|
1710
1707
|
return s.length >= e.length ? e.apply(this, s) : function() {
|
|
1711
|
-
for (var
|
|
1712
|
-
|
|
1713
|
-
return i.apply(r, [].concat(s,
|
|
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));
|
|
1714
1711
|
};
|
|
1715
1712
|
};
|
|
1716
1713
|
}
|
|
1717
|
-
function
|
|
1714
|
+
function bi(e) {
|
|
1718
1715
|
return {}.toString.call(e).includes("Object");
|
|
1719
1716
|
}
|
|
1720
|
-
function
|
|
1721
|
-
return e ||
|
|
1717
|
+
function gi(e) {
|
|
1718
|
+
return e || qe("configIsRequired"), bi(e) || qe("configType"), e.urls ? (vi(), {
|
|
1722
1719
|
paths: {
|
|
1723
1720
|
vs: e.urls.monacoBase
|
|
1724
1721
|
}
|
|
1725
1722
|
}) : e;
|
|
1726
1723
|
}
|
|
1727
|
-
function
|
|
1724
|
+
function vi() {
|
|
1728
1725
|
console.warn(Ye.deprecation);
|
|
1729
1726
|
}
|
|
1730
|
-
function
|
|
1727
|
+
function yi(e, i) {
|
|
1731
1728
|
throw new Error(e[i] || e.default);
|
|
1732
1729
|
}
|
|
1733
1730
|
var Ye = {
|
|
@@ -1744,14 +1741,14 @@ var Ye = {
|
|
|
1744
1741
|
|
|
1745
1742
|
For more please check the link https://github.com/suren-atoyan/monaco-loader#config
|
|
1746
1743
|
`
|
|
1747
|
-
},
|
|
1748
|
-
config:
|
|
1749
|
-
},
|
|
1744
|
+
}, qe = xi(yi)(Ye), ji = {
|
|
1745
|
+
config: gi
|
|
1746
|
+
}, wi = function() {
|
|
1750
1747
|
for (var i = arguments.length, r = new Array(i), n = 0; n < i; n++)
|
|
1751
1748
|
r[n] = arguments[n];
|
|
1752
1749
|
return function(s) {
|
|
1753
|
-
return r.reduceRight(function(o,
|
|
1754
|
-
return
|
|
1750
|
+
return r.reduceRight(function(o, d) {
|
|
1751
|
+
return d(o);
|
|
1755
1752
|
}, s);
|
|
1756
1753
|
};
|
|
1757
1754
|
};
|
|
@@ -1760,37 +1757,37 @@ function Je(e, i) {
|
|
|
1760
1757
|
i[r] instanceof Object && e[r] && Object.assign(i[r], Je(e[r], i[r]));
|
|
1761
1758
|
}), _e(_e({}, e), i);
|
|
1762
1759
|
}
|
|
1763
|
-
var
|
|
1760
|
+
var Ei = {
|
|
1764
1761
|
type: "cancelation",
|
|
1765
1762
|
msg: "operation is manually canceled"
|
|
1766
1763
|
};
|
|
1767
1764
|
function ye(e) {
|
|
1768
1765
|
var i = !1, r = new Promise(function(n, s) {
|
|
1769
1766
|
e.then(function(o) {
|
|
1770
|
-
return i ? s(
|
|
1767
|
+
return i ? s(Ei) : n(o);
|
|
1771
1768
|
}), e.catch(s);
|
|
1772
1769
|
});
|
|
1773
1770
|
return r.cancel = function() {
|
|
1774
1771
|
return i = !0;
|
|
1775
1772
|
}, r;
|
|
1776
1773
|
}
|
|
1777
|
-
var
|
|
1774
|
+
var Ni = ["monaco"], Ci = pi.create({
|
|
1778
1775
|
config: hi,
|
|
1779
1776
|
isInitialized: !1,
|
|
1780
1777
|
resolve: null,
|
|
1781
1778
|
reject: null,
|
|
1782
1779
|
monaco: null
|
|
1783
|
-
}), Be =
|
|
1784
|
-
function
|
|
1785
|
-
var i =
|
|
1786
|
-
|
|
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) {
|
|
1787
1784
|
return {
|
|
1788
1785
|
config: Je(s.config, n),
|
|
1789
1786
|
monaco: r
|
|
1790
1787
|
};
|
|
1791
1788
|
});
|
|
1792
1789
|
}
|
|
1793
|
-
function
|
|
1790
|
+
function Ti() {
|
|
1794
1791
|
var e = se(function(i) {
|
|
1795
1792
|
var r = i.monaco, n = i.isInitialized, s = i.resolve;
|
|
1796
1793
|
return {
|
|
@@ -1800,36 +1797,36 @@ function Oi() {
|
|
|
1800
1797
|
};
|
|
1801
1798
|
});
|
|
1802
1799
|
if (!e.isInitialized) {
|
|
1803
|
-
if (
|
|
1800
|
+
if (xe({
|
|
1804
1801
|
isInitialized: !0
|
|
1805
1802
|
}), e.monaco)
|
|
1806
1803
|
return e.resolve(e.monaco), ye(je);
|
|
1807
1804
|
if (window.monaco && window.monaco.editor)
|
|
1808
1805
|
return Ge(window.monaco), e.resolve(window.monaco), ye(je);
|
|
1809
|
-
|
|
1806
|
+
wi(Ii, ki)(Ri);
|
|
1810
1807
|
}
|
|
1811
1808
|
return ye(je);
|
|
1812
1809
|
}
|
|
1813
|
-
function
|
|
1810
|
+
function Ii(e) {
|
|
1814
1811
|
return document.body.appendChild(e);
|
|
1815
1812
|
}
|
|
1816
|
-
function
|
|
1813
|
+
function Si(e) {
|
|
1817
1814
|
var i = document.createElement("script");
|
|
1818
1815
|
return e && (i.src = e), i;
|
|
1819
1816
|
}
|
|
1820
|
-
function
|
|
1817
|
+
function ki(e) {
|
|
1821
1818
|
var i = se(function(n) {
|
|
1822
1819
|
var s = n.config, o = n.reject;
|
|
1823
1820
|
return {
|
|
1824
1821
|
config: s,
|
|
1825
1822
|
reject: o
|
|
1826
1823
|
};
|
|
1827
|
-
}), r =
|
|
1824
|
+
}), r = Si("".concat(i.config.paths.vs, "/loader.js"));
|
|
1828
1825
|
return r.onload = function() {
|
|
1829
1826
|
return e();
|
|
1830
1827
|
}, r.onerror = i.reject, r;
|
|
1831
1828
|
}
|
|
1832
|
-
function
|
|
1829
|
+
function Ri() {
|
|
1833
1830
|
var e = se(function(r) {
|
|
1834
1831
|
var n = r.config, s = r.resolve, o = r.reject;
|
|
1835
1832
|
return {
|
|
@@ -1846,220 +1843,231 @@ function ki() {
|
|
|
1846
1843
|
});
|
|
1847
1844
|
}
|
|
1848
1845
|
function Ge(e) {
|
|
1849
|
-
se().monaco ||
|
|
1846
|
+
se().monaco || xe({
|
|
1850
1847
|
monaco: e
|
|
1851
1848
|
});
|
|
1852
1849
|
}
|
|
1853
|
-
function
|
|
1850
|
+
function Ai() {
|
|
1854
1851
|
return se(function(e) {
|
|
1855
1852
|
var i = e.monaco;
|
|
1856
1853
|
return i;
|
|
1857
1854
|
});
|
|
1858
1855
|
}
|
|
1859
1856
|
var je = new Promise(function(e, i) {
|
|
1860
|
-
return
|
|
1857
|
+
return xe({
|
|
1861
1858
|
resolve: e,
|
|
1862
1859
|
reject: i
|
|
1863
1860
|
});
|
|
1864
1861
|
}), Ke = {
|
|
1865
|
-
config:
|
|
1866
|
-
init:
|
|
1867
|
-
__getMonacoInstance:
|
|
1868
|
-
},
|
|
1869
|
-
function
|
|
1870
|
-
return
|
|
1871
|
-
}
|
|
1872
|
-
var
|
|
1873
|
-
function qi({ width: e, height: i, isEditorReady: r, loading: n, _ref: s, className: o, wrapperProps:
|
|
1874
|
-
return
|
|
1875
|
-
}
|
|
1876
|
-
var
|
|
1877
|
-
function
|
|
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) {
|
|
1878
1875
|
J(e, []);
|
|
1879
1876
|
}
|
|
1880
|
-
var Qe =
|
|
1881
|
-
function
|
|
1882
|
-
let n =
|
|
1877
|
+
var Qe = Ui;
|
|
1878
|
+
function zi(e, i, r = !0) {
|
|
1879
|
+
let n = U(!0);
|
|
1883
1880
|
J(n.current || !r ? () => {
|
|
1884
1881
|
n.current = !1;
|
|
1885
1882
|
} : e, i);
|
|
1886
1883
|
}
|
|
1887
|
-
var W =
|
|
1884
|
+
var W = zi;
|
|
1888
1885
|
function ie() {
|
|
1889
1886
|
}
|
|
1890
1887
|
function Q(e, i, r, n) {
|
|
1891
|
-
return
|
|
1888
|
+
return Wi(e, n) || Vi(e, i, r, n);
|
|
1892
1889
|
}
|
|
1893
|
-
function
|
|
1890
|
+
function Wi(e, i) {
|
|
1894
1891
|
return e.editor.getModel(Ze(e, i));
|
|
1895
1892
|
}
|
|
1896
|
-
function
|
|
1893
|
+
function Vi(e, i, r, n) {
|
|
1897
1894
|
return e.editor.createModel(i, r, n ? Ze(e, n) : void 0);
|
|
1898
1895
|
}
|
|
1899
1896
|
function Ze(e, i) {
|
|
1900
1897
|
return e.Uri.parse(i);
|
|
1901
1898
|
}
|
|
1902
|
-
function
|
|
1903
|
-
let [
|
|
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);
|
|
1904
1901
|
Qe(() => {
|
|
1905
|
-
let
|
|
1906
|
-
return
|
|
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();
|
|
1907
1904
|
}), W(() => {
|
|
1908
|
-
if (
|
|
1909
|
-
let
|
|
1910
|
-
|
|
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);
|
|
1911
1908
|
}
|
|
1912
|
-
}, [o],
|
|
1913
|
-
if (
|
|
1914
|
-
let
|
|
1915
|
-
|
|
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);
|
|
1916
1913
|
}
|
|
1917
|
-
}, [
|
|
1918
|
-
let
|
|
1919
|
-
|
|
1920
|
-
}, [i],
|
|
1921
|
-
|
|
1922
|
-
}, [e],
|
|
1923
|
-
let { original:
|
|
1924
|
-
|
|
1925
|
-
}, [r, n, s],
|
|
1926
|
-
|
|
1927
|
-
}, [
|
|
1928
|
-
|
|
1929
|
-
}, [g],
|
|
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);
|
|
1930
1927
|
let p = de(() => {
|
|
1931
|
-
if (!
|
|
1932
|
-
|
|
1933
|
-
let
|
|
1934
|
-
|
|
1935
|
-
}, [r, i, s, e, n, o,
|
|
1936
|
-
!
|
|
1937
|
-
}, [g,
|
|
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]);
|
|
1938
1935
|
J(() => {
|
|
1939
|
-
|
|
1940
|
-
}, [
|
|
1941
|
-
!
|
|
1942
|
-
}, [
|
|
1943
|
-
function
|
|
1944
|
-
let
|
|
1945
|
-
|
|
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();
|
|
1946
1943
|
}
|
|
1947
|
-
return
|
|
1944
|
+
return l.createElement(Xe, { width: L, height: A, isEditorReady: j, loading: h, _ref: T, className: _, wrapperProps: N });
|
|
1948
1945
|
}
|
|
1949
|
-
var
|
|
1950
|
-
Ce(
|
|
1951
|
-
function
|
|
1952
|
-
let i =
|
|
1946
|
+
var Yi = Hi;
|
|
1947
|
+
Ce(Yi);
|
|
1948
|
+
function Ji(e) {
|
|
1949
|
+
let i = U();
|
|
1953
1950
|
return J(() => {
|
|
1954
1951
|
i.current = e;
|
|
1955
1952
|
}, [e]), i.current;
|
|
1956
1953
|
}
|
|
1957
|
-
var
|
|
1958
|
-
function
|
|
1959
|
-
let [
|
|
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);
|
|
1960
1957
|
Qe(() => {
|
|
1961
|
-
let
|
|
1962
|
-
return
|
|
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();
|
|
1963
1960
|
}), W(() => {
|
|
1964
|
-
let
|
|
1965
|
-
|
|
1966
|
-
}, [o],
|
|
1967
|
-
|
|
1968
|
-
}, [
|
|
1969
|
-
!
|
|
1970
|
-
}, [n],
|
|
1971
|
-
let
|
|
1972
|
-
|
|
1973
|
-
}, [s],
|
|
1974
|
-
|
|
1975
|
-
}, [
|
|
1976
|
-
|
|
1977
|
-
}, [
|
|
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);
|
|
1978
1975
|
let H = de(() => {
|
|
1979
|
-
if (!(!
|
|
1980
|
-
|
|
1981
|
-
let
|
|
1982
|
-
|
|
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;
|
|
1983
1980
|
}
|
|
1984
|
-
}, [e, i, r, n, s, o,
|
|
1981
|
+
}, [e, i, r, n, s, o, u, h, g, d, m]);
|
|
1985
1982
|
J(() => {
|
|
1986
|
-
|
|
1987
|
-
}, [
|
|
1988
|
-
!
|
|
1989
|
-
}, [
|
|
1990
|
-
|
|
1991
|
-
|
|
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);
|
|
1992
1989
|
}));
|
|
1993
|
-
}, [
|
|
1994
|
-
if (
|
|
1995
|
-
let
|
|
1996
|
-
let
|
|
1997
|
-
if (
|
|
1998
|
-
let D =
|
|
1999
|
-
|
|
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);
|
|
2000
1997
|
}
|
|
2001
1998
|
});
|
|
2002
1999
|
return () => {
|
|
2003
|
-
|
|
2000
|
+
a?.dispose();
|
|
2004
2001
|
};
|
|
2005
2002
|
}
|
|
2006
2003
|
return () => {
|
|
2007
2004
|
};
|
|
2008
|
-
}, [
|
|
2005
|
+
}, [b, S]);
|
|
2009
2006
|
function Y() {
|
|
2010
|
-
|
|
2007
|
+
M.current?.dispose(), A ? g && ce.set(o, k.current.saveViewState()) : k.current.getModel()?.dispose(), k.current.dispose();
|
|
2011
2008
|
}
|
|
2012
|
-
return
|
|
2013
|
-
}
|
|
2014
|
-
var
|
|
2015
|
-
function
|
|
2016
|
-
const e = $e(), i = V((
|
|
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(() => {
|
|
2017
2025
|
try {
|
|
2018
|
-
return
|
|
2026
|
+
return ae.dump(e, { indent: 2, lineWidth: -1 });
|
|
2019
2027
|
} catch {
|
|
2020
2028
|
return "";
|
|
2021
2029
|
}
|
|
2022
|
-
}), [
|
|
2023
|
-
|
|
2030
|
+
}), [O, R] = l.useState("");
|
|
2031
|
+
l.useEffect(() => {
|
|
2024
2032
|
r.setCodeEditorHasError(!1);
|
|
2025
2033
|
}, []);
|
|
2026
|
-
const
|
|
2027
|
-
|
|
2028
|
-
const
|
|
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(() => {
|
|
2036
|
+
const f = () => {
|
|
2029
2037
|
if (s.current) {
|
|
2030
|
-
const
|
|
2031
|
-
|
|
2038
|
+
const T = s.current.getBoundingClientRect().top, w = window.innerHeight - T - 20;
|
|
2039
|
+
L(Math.max(400, w));
|
|
2032
2040
|
}
|
|
2033
2041
|
};
|
|
2034
|
-
return
|
|
2035
|
-
}, []),
|
|
2036
|
-
if (!
|
|
2042
|
+
return f(), window.addEventListener("resize", f), () => window.removeEventListener("resize", f);
|
|
2043
|
+
}, []), l.useEffect(() => {
|
|
2044
|
+
if (!m.current)
|
|
2037
2045
|
try {
|
|
2038
|
-
const
|
|
2039
|
-
|
|
2040
|
-
} catch (
|
|
2041
|
-
|
|
2046
|
+
const f = I(e);
|
|
2047
|
+
N(f), o.current = f, R(""), r.setCodeEditorHasError(!1);
|
|
2048
|
+
} catch (f) {
|
|
2049
|
+
R(`Failed to serialize: ${f.message}`), r.setCodeEditorHasError(!0);
|
|
2042
2050
|
}
|
|
2043
|
-
}, [e,
|
|
2044
|
-
const
|
|
2045
|
-
|
|
2051
|
+
}, [e, I, r]);
|
|
2052
|
+
const S = (f) => {
|
|
2053
|
+
N(f || ""), o.current = f || "", m.current = !0;
|
|
2046
2054
|
try {
|
|
2047
|
-
const
|
|
2048
|
-
if (!
|
|
2055
|
+
const T = j(f || "{}");
|
|
2056
|
+
if (!T || typeof T != "object")
|
|
2049
2057
|
throw new Error("Invalid form data: must be an object");
|
|
2050
|
-
|
|
2051
|
-
} catch (
|
|
2052
|
-
const
|
|
2053
|
-
|
|
2058
|
+
R(""), r.setCodeEditorHasError(!1);
|
|
2059
|
+
} catch (T) {
|
|
2060
|
+
const w = `Invalid ${c.toUpperCase()}: ${T.message}`;
|
|
2061
|
+
R(w), r.setCodeEditorHasError(!0);
|
|
2054
2062
|
}
|
|
2055
|
-
},
|
|
2056
|
-
|
|
2057
|
-
const
|
|
2063
|
+
}, b = (f) => {
|
|
2064
|
+
d.current = f, f.onDidPaste((T) => {
|
|
2065
|
+
const w = _, k = f.getModel().getValue();
|
|
2058
2066
|
try {
|
|
2059
|
-
const
|
|
2060
|
-
if (
|
|
2061
|
-
const { schemaType:
|
|
2062
|
-
|
|
2067
|
+
const P = j(k);
|
|
2068
|
+
if (P && typeof P == "object") {
|
|
2069
|
+
const { schemaType: p } = fe(P);
|
|
2070
|
+
p === "surveyjs" && n(
|
|
2063
2071
|
`This SurveyJS schema will be converted to MIE Forms format.
|
|
2064
2072
|
|
|
2065
2073
|
Do you want to proceed with the conversion?`,
|
|
@@ -2068,20 +2076,20 @@ Do you want to proceed with the conversion?`,
|
|
|
2068
2076
|
confirmText: "Yes, Convert",
|
|
2069
2077
|
cancelText: "No, Cancel Paste",
|
|
2070
2078
|
onConfirm: () => {
|
|
2071
|
-
const { fields:
|
|
2072
|
-
schemaType:
|
|
2073
|
-
...
|
|
2074
|
-
fields:
|
|
2079
|
+
const { fields: C, conversionReport: M } = pe(P, p), E = {
|
|
2080
|
+
schemaType: P.schemaType || ve,
|
|
2081
|
+
...M?.surveyMetadata || {},
|
|
2082
|
+
fields: C
|
|
2075
2083
|
};
|
|
2076
2084
|
i(E);
|
|
2077
|
-
const
|
|
2078
|
-
|
|
2079
|
-
const
|
|
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;
|
|
2080
2088
|
n(
|
|
2081
2089
|
`This schema has been converted to MIE Forms format.
|
|
2082
2090
|
|
|
2083
|
-
Converted: ${
|
|
2084
|
-
Unsupported: ${
|
|
2091
|
+
Converted: ${M?.convertedFields || 0} field(s)
|
|
2092
|
+
Unsupported: ${$} field(s)${$ > 0 ? " ⚠️" : ""}
|
|
2085
2093
|
|
|
2086
2094
|
Please use MIE Forms schema inside of code editor for the best experience in the future.`,
|
|
2087
2095
|
{ title: "ℹ️ SurveyJS Schema Detected" }
|
|
@@ -2089,7 +2097,7 @@ Please use MIE Forms schema inside of code editor for the best experience in the
|
|
|
2089
2097
|
}, 100));
|
|
2090
2098
|
},
|
|
2091
2099
|
onCancel: () => {
|
|
2092
|
-
|
|
2100
|
+
f.setValue(w), N(w), o.current = w;
|
|
2093
2101
|
}
|
|
2094
2102
|
}
|
|
2095
2103
|
);
|
|
@@ -2097,65 +2105,65 @@ Please use MIE Forms schema inside of code editor for the best experience in the
|
|
|
2097
2105
|
} catch {
|
|
2098
2106
|
}
|
|
2099
2107
|
});
|
|
2100
|
-
},
|
|
2108
|
+
}, x = (f) => {
|
|
2101
2109
|
try {
|
|
2102
|
-
const
|
|
2103
|
-
|
|
2104
|
-
} catch (
|
|
2105
|
-
|
|
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);
|
|
2106
2114
|
}
|
|
2107
2115
|
};
|
|
2108
|
-
return
|
|
2109
|
-
const
|
|
2110
|
-
if (!
|
|
2111
|
-
i({ schemaType: ve, fields: [] }),
|
|
2116
|
+
return l.useEffect(() => () => {
|
|
2117
|
+
const f = o.current?.trim();
|
|
2118
|
+
if (!f) {
|
|
2119
|
+
i({ schemaType: ve, fields: [] }), m.current = !1;
|
|
2112
2120
|
return;
|
|
2113
2121
|
}
|
|
2114
2122
|
try {
|
|
2115
|
-
const
|
|
2116
|
-
if (!
|
|
2117
|
-
const { schemaType:
|
|
2118
|
-
schemaType:
|
|
2119
|
-
...
|
|
2120
|
-
fields:
|
|
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
|
|
2121
2129
|
};
|
|
2122
|
-
|
|
2130
|
+
P && r.setConversionReport(P), i(p), r.setCodeEditorHasError(!1), m.current = !1;
|
|
2123
2131
|
} catch {
|
|
2124
2132
|
}
|
|
2125
|
-
}, [
|
|
2126
|
-
/* @__PURE__ */ t.jsxs("div", { className: "code-editor-header mie:flex mie:items-center mie:justify-between mie:gap-3 mie:p-4 mie:bg-
|
|
2127
|
-
/* @__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-
|
|
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: [
|
|
2128
2136
|
/* @__PURE__ */ t.jsx(
|
|
2129
2137
|
"button",
|
|
2130
2138
|
{
|
|
2131
|
-
onClick: () =>
|
|
2132
|
-
className: `mie:px-3 mie:py-1 mie:rounded-md mie:text-sm mie:font-medium mie:transition-colors ${
|
|
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"}`,
|
|
2133
2141
|
children: "YAML"
|
|
2134
2142
|
}
|
|
2135
2143
|
),
|
|
2136
2144
|
/* @__PURE__ */ t.jsx(
|
|
2137
2145
|
"button",
|
|
2138
2146
|
{
|
|
2139
|
-
onClick: () =>
|
|
2140
|
-
className: `mie:px-3 mie:py-1 mie:rounded-md mie:text-sm mie:font-medium mie:transition-colors ${
|
|
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"}`,
|
|
2141
2149
|
children: "JSON"
|
|
2142
2150
|
}
|
|
2143
2151
|
)
|
|
2144
2152
|
] }) }),
|
|
2145
2153
|
/* @__PURE__ */ t.jsxs("div", { className: "mie:flex mie:items-center mie:gap-2", children: [
|
|
2146
|
-
/* @__PURE__ */ t.jsx("div", { className: "mie:text-xs mie:text-
|
|
2147
|
-
|
|
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 })
|
|
2148
2156
|
] })
|
|
2149
2157
|
] }),
|
|
2150
2158
|
/* @__PURE__ */ t.jsx("div", { className: "code-editor-content mie:flex-1 mie:overflow-hidden", children: /* @__PURE__ */ t.jsx(
|
|
2151
|
-
|
|
2159
|
+
Qi,
|
|
2152
2160
|
{
|
|
2153
2161
|
height: "100%",
|
|
2154
|
-
language:
|
|
2155
|
-
value:
|
|
2156
|
-
onChange:
|
|
2157
|
-
onMount:
|
|
2158
|
-
theme: "light",
|
|
2162
|
+
language: c,
|
|
2163
|
+
value: _,
|
|
2164
|
+
onChange: S,
|
|
2165
|
+
onMount: b,
|
|
2166
|
+
theme: h ? "vs-dark" : "light",
|
|
2159
2167
|
options: {
|
|
2160
2168
|
minimap: { enabled: !1 },
|
|
2161
2169
|
fontSize: 13,
|
|
@@ -2173,30 +2181,30 @@ Please use MIE Forms schema inside of code editor for the best experience in the
|
|
|
2173
2181
|
) })
|
|
2174
2182
|
] });
|
|
2175
2183
|
}
|
|
2176
|
-
function
|
|
2177
|
-
const i = B(), [r, n] =
|
|
2178
|
-
return /* @__PURE__ */ t.jsxs("div", { className: "layout-container mie:w-full mie:h-fit mie:rounded-lg mie:mt-
|
|
2179
|
-
o ? /* @__PURE__ */ t.jsx("div", { className: "mie:border mie:border-
|
|
2180
|
-
|
|
2181
|
-
/* @__PURE__ */ t.jsx("div", { className: "layout-main-content mie:flex-1 mie:min-w-0", children: /* @__PURE__ */ t.jsx(
|
|
2182
|
-
|
|
2183
|
-
|
|
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: [
|
|
2184
2192
|
/* @__PURE__ */ t.jsx(
|
|
2185
2193
|
"div",
|
|
2186
2194
|
{
|
|
2187
|
-
className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-
|
|
2195
|
+
className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-mieoverlay mie:lg:hidden",
|
|
2188
2196
|
onClick: () => i.modal.set(!1)
|
|
2189
2197
|
}
|
|
2190
2198
|
),
|
|
2191
|
-
/* @__PURE__ */ t.jsx("div", { className: "mie:fixed mie:bottom-0 mie:left-0 mie:right-0 mie:z-50 mie:bg-
|
|
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) })
|
|
2192
2200
|
] }) })
|
|
2193
2201
|
] }),
|
|
2194
|
-
|
|
2202
|
+
c && !o && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
|
|
2195
2203
|
/* @__PURE__ */ t.jsx(
|
|
2196
2204
|
"button",
|
|
2197
2205
|
{
|
|
2198
2206
|
onClick: () => n(!r),
|
|
2199
|
-
className: "mie:lg:hidden mie:fixed mie:bottom-5 mie:left-5 mie:z-40 mie:bg-
|
|
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",
|
|
2200
2208
|
title: "Add field",
|
|
2201
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" }) })
|
|
2202
2210
|
}
|
|
@@ -2205,73 +2213,84 @@ function Zi({ selectedField: e }) {
|
|
|
2205
2213
|
/* @__PURE__ */ t.jsx(
|
|
2206
2214
|
"div",
|
|
2207
2215
|
{
|
|
2208
|
-
className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-
|
|
2216
|
+
className: "mie:fixed mie:inset-0 mie:z-40 mie:bg-mieoverlay mie:lg:hidden",
|
|
2209
2217
|
onClick: () => n(!1)
|
|
2210
2218
|
}
|
|
2211
2219
|
),
|
|
2212
|
-
/* @__PURE__ */ t.jsx("div", { className: "mie:fixed mie:bottom-0 mie:left-0 mie:right-0 mie:z-50 mie:bg-
|
|
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, {}) })
|
|
2213
2221
|
] })
|
|
2214
2222
|
] })
|
|
2215
2223
|
] });
|
|
2216
2224
|
}
|
|
2217
|
-
function
|
|
2225
|
+
function tr({
|
|
2218
2226
|
initialFormData: e,
|
|
2219
2227
|
schemaType: i,
|
|
2220
2228
|
onChange: r,
|
|
2221
2229
|
className: n = "",
|
|
2222
2230
|
showHeader: s = !0,
|
|
2223
2231
|
startInPreview: o = !1,
|
|
2224
|
-
hideUnsupportedFields:
|
|
2232
|
+
hideUnsupportedFields: d = !1,
|
|
2233
|
+
theme: m = "auto"
|
|
2225
2234
|
}) {
|
|
2226
|
-
const [
|
|
2227
|
-
|
|
2228
|
-
if (!(
|
|
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)) {
|
|
2229
2238
|
if (e)
|
|
2230
2239
|
try {
|
|
2231
|
-
const { data:
|
|
2232
|
-
|
|
2233
|
-
const
|
|
2234
|
-
schemaType:
|
|
2235
|
-
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 || []
|
|
2236
2245
|
};
|
|
2237
|
-
if (
|
|
2238
|
-
Object.assign(
|
|
2239
|
-
else if (
|
|
2240
|
-
const { fields:
|
|
2241
|
-
Object.keys(
|
|
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);
|
|
2242
2251
|
}
|
|
2243
|
-
Array.isArray(
|
|
2252
|
+
Array.isArray(I.fields) && I.fields.length && A.getState().replaceAll(I);
|
|
2244
2253
|
} catch {
|
|
2245
|
-
|
|
2254
|
+
A.getState().replaceAll({ schemaType: "mieforms-v1.0", fields: [] });
|
|
2246
2255
|
}
|
|
2247
|
-
|
|
2256
|
+
h.preview.set(!!o), g.current = !0;
|
|
2248
2257
|
}
|
|
2249
|
-
}, [e, i, o,
|
|
2250
|
-
|
|
2251
|
-
}, [
|
|
2252
|
-
if (!(!r || !
|
|
2253
|
-
return
|
|
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) => {
|
|
2254
2263
|
r({
|
|
2255
|
-
schemaType:
|
|
2256
|
-
...
|
|
2257
|
-
fields:
|
|
2264
|
+
schemaType: O.schemaType || "mieforms-v1.0",
|
|
2265
|
+
...O.schemaMetadata,
|
|
2266
|
+
fields: O.order.map((R) => O.byId[R])
|
|
2258
2267
|
});
|
|
2259
2268
|
});
|
|
2260
|
-
}, [r,
|
|
2261
|
-
const
|
|
2262
|
-
|
|
2263
|
-
(
|
|
2264
|
-
);
|
|
2265
|
-
return
|
|
2266
|
-
|
|
2267
|
-
|
|
2268
|
-
|
|
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
|
+
] }) });
|
|
2269
2288
|
}
|
|
2270
|
-
function
|
|
2271
|
-
const i =
|
|
2272
|
-
return /* @__PURE__ */ t.jsx(
|
|
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 }) }) });
|
|
2273
2292
|
}
|
|
2274
2293
|
export {
|
|
2275
|
-
|
|
2294
|
+
or as QuestionnaireEditor
|
|
2276
2295
|
};
|
|
2277
2296
|
//# sourceMappingURL=index.js.map
|