@francistinao/formiq-sdk 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/README.md +39 -0
  2. package/dist/favicon.ico +0 -0
  3. package/dist/formiq-sdk.css +1 -0
  4. package/dist/index.cjs +67 -0
  5. package/dist/index.js +1485 -0
  6. package/dist/logo192.png +0 -0
  7. package/dist/logo512.png +0 -0
  8. package/dist/manifest.json +25 -0
  9. package/dist/robots.txt +3 -0
  10. package/package.json +93 -0
package/README.md ADDED
@@ -0,0 +1,39 @@
1
+ # Formiq SDK
2
+
3
+ Embed Formiq board components (e.g. `/b/[boardId]`) inside existing React applications.
4
+
5
+ **Prerequisite**
6
+
7
+ 1. Create a Formiq account at `formiq-steel.vercel.app`.
8
+ 2. Open **Settings** in the Formiq app.
9
+ 3. Generate a Personal Access Token (PAT).
10
+
11
+ ## Install
12
+
13
+ ```bash
14
+ pnpm add @formiq/formiq-sdk
15
+ # or
16
+ npm install @formiq/formiq-sdk
17
+ # or
18
+ yarn add @formiq/formiq-sdk
19
+ ```
20
+
21
+ ## Usage
22
+
23
+ ```tsx
24
+ import { FormiqProvider, BoardEditor } from '@formiq/formiq-sdk'
25
+ import '@formiq/formiq-sdk/styles.css'
26
+
27
+ function App() {
28
+ return (
29
+ <FormiqProvider token="formiq_3dc...">
30
+ <BoardEditor boardId="YOUR_BOARD_ID" />
31
+ </FormiqProvider>
32
+ )
33
+ }
34
+ ```
35
+
36
+ ## Notes
37
+
38
+ - The PAT is required to load board data and generate PDFs.
39
+ - Wrap your editor components with `FormiqProvider` so API requests include the PAT automatically.
package/dist/favicon.ico ADDED
Binary file
package/dist/formiq-sdk.css ADDED
@@ -0,0 +1 @@
1
+ @import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&family=Manrope:wght@400;500;600;700;800&display=swap";@layer components;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:"Manrope", ui-sans-serif, system-ui, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--container-3xl:48rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--radius-xl:.75rem;--radius-2xl:1rem;--blur-lg:16px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-none{pointer-events:none}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.-top-24{top:calc(var(--spacing) * -24)}.top-0{top:calc(var(--spacing) * 0)}.-right-20{right:calc(var(--spacing) * -20)}.-bottom-20{bottom:calc(var(--spacing) * -20)}.-left-20{left:calc(var(--spacing) * -20)}.z-50{z-index:50}.order-3{order:3}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing) * 0)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-20{margin-top:calc(var(--spacing) * 20)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-auto{margin-left:auto}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-2{height:calc(var(--spacing) * 2)}.h-56{height:calc(var(--spacing) * 56)}.w-2{width:calc(var(--spacing) * 2)}.w-56{width:calc(var(--spacing) * 56)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.flex-shrink-0{flex-shrink:0}.list-disc{list-style-type:disc}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-3{column-gap:calc(var(--spacing) * 3)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-y-1{row-gap:calc(var(--spacing) * 1)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[2rem\]{border-radius:2rem}.rounded-full{border-radius:3.40282e38px}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-\[rgba\(23\,58\,64\,0\.2\)\]{border-color:#173a4033}.border-\[rgba\(50\,143\,151\,0\.3\)\]{border-color:#328f974d}.border-\[var\(--chip-line\)\]{border-color:var(--chip-line)}.border-\[var\(--line\)\]{border-color:var(--line)}.bg-\[rgba\(79\,184\,178\,0\.14\)\]{background-color:#4fb8b224}.bg-\[var\(--chip-bg\)\]{background-color:var(--chip-bg)}.bg-\[var\(--header-bg\)\]{background-color:var(--header-bg)}.bg-white\/50{background-color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.bg-white\/50{background-color:color-mix(in oklab,var(--color-white) 50%,transparent)}}.bg-\[linear-gradient\(90deg\,\#56c6be\,\#7ed3bf\)\]{background-image:linear-gradient(90deg,#56c6be,#7ed3bf)}.bg-\[radial-gradient\(circle\,rgba\(47\,106\,74\,0\.18\)\,transparent_66\%\)\]{background-image:radial-gradient(circle,#2f6a4a2e,#0000 66%)}.bg-\[radial-gradient\(circle\,rgba\(79\,184\,178\,0\.32\)\,transparent_66\%\)\]{background-image:radial-gradient(circle,#4fb8b252,#0000 66%)}.p-2{padding:calc(var(--spacing) * 2)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-12{padding-block:calc(var(--spacing) * 12)}.pt-10{padding-top:calc(var(--spacing) * 10)}.pt-14{padding-top:calc(var(--spacing) * 14)}.pb-1{padding-bottom:calc(var(--spacing) * 1)}.pb-8{padding-bottom:calc(var(--spacing) * 8)}.pb-14{padding-bottom:calc(var(--spacing) * 14)}.pl-5{padding-left:calc(var(--spacing) * 5)}.text-center{text-align:center}.font-sans{font-family:var(--font-sans)}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.leading-\[1\.02\]{--tw-leading:1.02;line-height:1.02}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.\[overflow-wrap\:anywhere\]{overflow-wrap:anywhere}.text-\[var\(--lagoon-deep\)\]{color:var(--lagoon-deep)}.text-\[var\(--sea-ink\)\]{color:var(--sea-ink)}.text-\[var\(--sea-ink-soft\)\]{color:var(--sea-ink-soft)}.italic{font-style:italic}.no-underline{text-decoration-line:none}.underline{text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow-\[0_8px_22px_rgba\(30\,90\,72\,0\.08\)\]{--tw-shadow:0 8px 22px var(--tw-shadow-color,#1e5a4814);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-\[0_8px_24px_rgba\(30\,90\,72\,0\.08\)\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#1e5a4814);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.backdrop-blur-lg{--tw-backdrop-blur:blur(var(--blur-lg));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{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;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.selection\:bg-\[rgba\(79\,184\,178\,0\.24\)\] ::selection{background-color:#4fb8b23d}.selection\:bg-\[rgba\(79\,184\,178\,0\.24\)\]::selection{background-color:#4fb8b23d}@media(hover:hover){.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-\[rgba\(23\,58\,64\,0\.35\)\]:hover{border-color:#173a4059}.hover\:bg-\[rgba\(79\,184\,178\,0\.24\)\]:hover{background-color:#4fb8b23d}.hover\:bg-\[var\(--link-bg-hover\)\]:hover{background-color:var(--link-bg-hover)}.hover\:text-\[var\(--sea-ink\)\]:hover{color:var(--sea-ink)}}@media(min-width:40rem){.sm\:order-2{order:2}.sm\:ml-0{margin-left:calc(var(--spacing) * 0)}.sm\:block{display:block}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:flex-nowrap{flex-wrap:nowrap}.sm\:gap-2{gap:calc(var(--spacing) * 2)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-10{padding-inline:calc(var(--spacing) * 10)}.sm\:py-2{padding-block:calc(var(--spacing) * 2)}.sm\:py-4{padding-block:calc(var(--spacing) * 4)}.sm\:py-14{padding-block:calc(var(--spacing) * 14)}.sm\:pb-0{padding-bottom:calc(var(--spacing) * 0)}.sm\:text-left{text-align:left}.sm\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.sm\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.sm\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}}@media(min-width:64rem){.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}}:root{--sea-ink:#173a40;--sea-ink-soft:#416166;--lagoon:#4fb8b2;--lagoon-deep:#328f97;--palm:#2f6a4a;--sand:#e7f0e8;--foam:#f3faf5;--surface:#ffffffbd;--surface-strong:#ffffffe6;--line:#173a4024;--inset-glint:#ffffffd1;--kicker:#2f6a4ae6;--bg-base:#e7f3ec;--header-bg:#fbfff8d6;--chip-bg:#fffc;--chip-line:#2f6a4a2e;--link-bg-hover:#ffffffe6;--hero-a:#4fb8b25c;--hero-b:#2f6a4a33}:root[data-theme=dark]{--sea-ink:#d7ece8;--sea-ink-soft:#afcdc8;--lagoon:#60d7cf;--lagoon-deep:#8de5db;--palm:#6ec89a;--sand:#0f1a1e;--foam:#101d22;--surface:#101e22cc;--surface-strong:#0f1b1feb;--line:#8de5db2e;--inset-glint:#c2f7ee24;--kicker:#b8efe5;--bg-base:#0a1418;--header-bg:#0a1418cc;--chip-bg:#0d1c20e6;--chip-line:#8de5db3d;--link-bg-hover:#182c31cc;--hero-a:#60d7cf2e;--hero-b:#6ec89a1f}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--sea-ink:#d7ece8;--sea-ink-soft:#afcdc8;--lagoon:#60d7cf;--lagoon-deep:#8de5db;--palm:#6ec89a;--sand:#0f1a1e;--foam:#101d22;--surface:#101e22cc;--surface-strong:#0f1b1feb;--line:#8de5db2e;--inset-glint:#c2f7ee24;--kicker:#b8efe5;--bg-base:#0a1418;--header-bg:#0a1418cc;--chip-bg:#0d1c20e6;--chip-line:#8de5db3d;--link-bg-hover:#182c31cc;--hero-a:#60d7cf2e;--hero-b:#6ec89a1f}}*{box-sizing:border-box}html,body,#app{min-height:100%}body{color:var(--sea-ink);font-family:var(--font-sans);background-color:var(--bg-base);background:radial-gradient(1100px 620px at -8% -10%,var(--hero-a),transparent 58%),radial-gradient(1050px 620px at 112% -12%,var(--hero-b),transparent 62%),radial-gradient(720px 380px at 50% 115%,#4fb8b21a,transparent 68%),linear-gradient(180deg,var(--sand) 0%,var(--foam) 44%,var(--bg-base) 100%);margin:0}@supports (color:color-mix(in lab,red,red)){body{background:radial-gradient(1100px 620px at -8% -10%,var(--hero-a),transparent 58%),radial-gradient(1050px 620px at 112% -12%,var(--hero-b),transparent 62%),radial-gradient(720px 380px at 50% 115%,#4fb8b21a,transparent 68%),linear-gradient(180deg,color-mix(in oklab,var(--sand) 68%,white) 0%,var(--foam) 44%,var(--bg-base) 100%)}}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:-1;opacity:.28;background:radial-gradient(circle at 20% 15%,#fffc,#0000 34%),radial-gradient(circle at 78% 26%,#4fb8b233,#0000 42%),radial-gradient(circle at 42% 82%,#2f6a4a24,#0000 36%);position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:-1;opacity:.14;background-image:linear-gradient(#ffffff12 1px,#0000 1px),linear-gradient(90deg,#ffffff0f 1px,#0000 1px);background-size:28px 28px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle at 50% 30%,#000,#0000 78%);mask-image:radial-gradient(circle at 50% 30%,#000,#0000 78%)}a{color:var(--lagoon-deep);text-underline-offset:2px;text-decoration-color:#328f9766;text-decoration-thickness:1px}a:hover{color:#246f76}code{border:1px solid var(--line);background:var(--surface-strong);font-size:.9em}@supports (color:color-mix(in lab,red,red)){code{background:color-mix(in oklab,var(--surface-strong) 82%,white 18%)}}code{border-radius:7px;padding:2px 7px}pre code{font-size:inherit;color:inherit;background:0 0;border:0;border-radius:0;padding:0}.page-wrap{width:min(1080px,100% - 2rem);margin-inline:auto}.display-title{font-family:Fraunces,Georgia,serif}.island-shell{border:1px solid var(--line);background:linear-gradient(165deg,var(--surface-strong),var(--surface));box-shadow:0 1px 0 var(--inset-glint) inset,0 22px 44px #1e5a481a,0 6px 18px #173a4014;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.feature-card{background:linear-gradient(165deg,var(--surface-strong),var(--surface))}@supports (color:color-mix(in lab,red,red)){.feature-card{background:linear-gradient(165deg,color-mix(in oklab,var(--surface-strong) 93%,white 7%),var(--surface))}}.feature-card{box-shadow:0 1px 0 var(--inset-glint) inset,0 18px 34px #1e5a481a,0 4px 14px #173a400f}.feature-card:hover{border-color:var(--lagoon-deep);transform:translateY(-2px)}@supports (color:color-mix(in lab,red,red)){.feature-card:hover{border-color:color-mix(in oklab,var(--lagoon-deep) 35%,var(--line))}}button,.island-shell,a{transition:background-color .18s,color .18s,border-color .18s,transform .18s}.island-kicker{letter-spacing:.16em;text-transform:uppercase;color:var(--kicker);font-size:.69rem;font-weight:700}.nav-link{color:var(--sea-ink-soft);align-items:center;text-decoration:none;display:inline-flex;position:relative}.nav-link:after{content:"";transform-origin:0;background:linear-gradient(90deg,var(--lagoon),#7ed3bf);width:100%;height:2px;transition:transform .17s;position:absolute;bottom:-6px;left:0;transform:scaleX(0)}.nav-link:hover,.nav-link.is-active{color:var(--sea-ink)}.nav-link:hover:after,.nav-link.is-active:after{transform:scaleX(1)}@media(max-width:640px){.nav-link:after{bottom:-4px}}.site-footer{border-top:1px solid var(--line);background:var(--header-bg)}@supports (color:color-mix(in lab,red,red)){.site-footer{background:color-mix(in oklab,var(--header-bg) 84%,transparent 16%)}}.rise-in{animation:.7s cubic-bezier(.16,1,.3,1) both rise-in}@keyframes rise-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.formiq-board{flex-direction:column;gap:16px;padding:20px;display:flex}.formiq-board__header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.formiq-board__title{color:var(--sea-ink);font-size:1.25rem;font-weight:700}.formiq-board__actions{align-items:center;gap:10px;display:flex}.formiq-board__button{border:1px solid var(--line);background:var(--lagoon);color:#fff;cursor:pointer;border-radius:999px;padding:10px 16px;font-weight:600}.formiq-board__button:disabled{opacity:.6;cursor:not-allowed}.formiq-board__button--ghost{color:var(--sea-ink);background:0 0}.formiq-board__error{color:#9f1239;background:#d23a3a1a;border:1px solid #d23a3a4d;border-radius:12px;padding:12px 14px;font-weight:600}.formiq-board__empty{border:1px dashed var(--line);color:var(--sea-ink-soft);border-radius:16px;padding:16px}.formiq-board__canvas{border:1px solid var(--line);background:var(--surface);border-radius:18px;min-height:520px;overflow:hidden}.formiq-board-canvas{flex:1;min-height:0;display:flex}.formiq-board-canvas__stage{background:0 0;flex:1;min-height:600px;overflow:auto}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}
package/dist/index.cjs ADDED
@@ -0,0 +1,67 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react"),H=require("@tanstack/react-query"),Me=require("axios"),Ae=require("lodash"),q=require("react-konva"),oe=require("use-image"),ke=require("zustand");var se={exports:{}},ne={};var fe;function Ie(){if(fe)return ne;fe=1;var e=Symbol.for("react.transitional.element"),t=Symbol.for("react.fragment");function n(a,s,o){var c=null;if(o!==void 0&&(c=""+o),s.key!==void 0&&(c=""+s.key),"key"in s){o={};for(var p in s)p!=="key"&&(o[p]=s[p])}else o=s;return s=o.ref,{$$typeof:e,type:a,key:c,ref:s!==void 0?s:null,props:o}}return ne.Fragment=t,ne.jsx=n,ne.jsxs=n,ne}var ie={};var ge;function je(){return ge||(ge=1,process.env.NODE_ENV!=="production"&&(function(){function e(i){if(i==null)return null;if(typeof i=="function")return i.$$typeof===L?null:i.displayName||i.name||null;if(typeof i=="string")return i;switch(i){case m:return"Fragment";case P:return"Profiler";case u:return"StrictMode";case h:return"Suspense";case v:return"SuspenseList";case M:return"Activity"}if(typeof i=="object")switch(typeof i.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),i.$$typeof){case R:return"Portal";case j:return i.displayName||"Context";case F:return(i._context.displayName||"Context")+".Consumer";case X:var r=i.render;return i=i.displayName,i||(i=r.displayName||r.name||"",i=i!==""?"ForwardRef("+i+")":"ForwardRef"),i;case A:return r=i.displayName||null,r!==null?r:e(i.type)||"Memo";case T:r=i._payload,i=i._init;try{return e(i(r))}catch{}}return null}function t(i){return""+i}function n(i){try{t(i);var r=!1}catch{r=!0}if(r){r=console;var g=r.error,f=typeof Symbol=="function"&&Symbol.toStringTag&&i[Symbol.toStringTag]||i.constructor.name||"Object";return g.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",f),t(i)}}function a(i){if(i===m)return"<>";if(typeof i=="object"&&i!==null&&i.$$typeof===T)return"<...>";try{var r=e(i);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function s(){var i=B.A;return i===null?null:i.getOwner()}function o(){return Error("react-stack-top-frame")}function c(i){if($.call(i,"key")){var r=Object.getOwnPropertyDescriptor(i,"key").get;if(r&&r.isReactWarning)return!1}return i.key!==void 0}function p(i,r){function g(){G||(G=!0,console.error("%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)",r))}g.isReactWarning=!0,Object.defineProperty(i,"key",{get:g,configurable:!0})}function w(){var i=e(this.type);return Q[i]||(Q[i]=!0,console.error("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.")),i=this.props.ref,i!==void 0?i:null}function _(i,r,g,f,W,U){var S=g.ref;return i={$$typeof:y,type:i,key:r,props:g,_owner:f},(S!==void 0?S:null)!==null?Object.defineProperty(i,"ref",{enumerable:!1,get:w}):Object.defineProperty(i,"ref",{enumerable:!1,value:null}),i._store={},Object.defineProperty(i._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(i,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(i,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:W}),Object.defineProperty(i,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:U}),Object.freeze&&(Object.freeze(i.props),Object.freeze(i)),i}function k(i,r,g,f,W,U){var S=r.children;if(S!==void 0)if(f)if(D(S)){for(f=0;f<S.length;f++)C(S[f]);Object.freeze&&Object.freeze(S)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else C(S);if($.call(r,"key")){S=e(i);var K=Object.keys(r).filter(function(E){return E!=="key"});f=0<K.length?"{key: someKey, "+K.join(": ..., ")+": ...}":"{key: someKey}",re[S+f]||(K=0<K.length?"{"+K.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
2
+ let props = %s;
3
+ <%s {...props} />
4
+ React keys must be passed directly to JSX without using spread:
5
+ let props = %s;
6
+ <%s key={someKey} {...props} />`,f,S,K,S),re[S+f]=!0)}if(S=null,g!==void 0&&(n(g),S=""+g),c(r)&&(n(r.key),S=""+r.key),"key"in r){g={};for(var N in r)N!=="key"&&(g[N]=r[N])}else g=r;return S&&p(g,typeof i=="function"?i.displayName||i.name||"Unknown":i),_(i,S,g,s(),W,U)}function C(i){I(i)?i._store&&(i._store.validated=1):typeof i=="object"&&i!==null&&i.$$typeof===T&&(i._payload.status==="fulfilled"?I(i._payload.value)&&i._payload.value._store&&(i._payload.value._store.validated=1):i._store&&(i._store.validated=1))}function I(i){return typeof i=="object"&&i!==null&&i.$$typeof===y}var l=d,y=Symbol.for("react.transitional.element"),R=Symbol.for("react.portal"),m=Symbol.for("react.fragment"),u=Symbol.for("react.strict_mode"),P=Symbol.for("react.profiler"),F=Symbol.for("react.consumer"),j=Symbol.for("react.context"),X=Symbol.for("react.forward_ref"),h=Symbol.for("react.suspense"),v=Symbol.for("react.suspense_list"),A=Symbol.for("react.memo"),T=Symbol.for("react.lazy"),M=Symbol.for("react.activity"),L=Symbol.for("react.client.reference"),B=l.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,$=Object.prototype.hasOwnProperty,D=Array.isArray,b=console.createTask?console.createTask:function(){return null};l={react_stack_bottom_frame:function(i){return i()}};var G,Q={},Z=l.react_stack_bottom_frame.bind(l,o)(),V=b(a(o)),re={};ie.Fragment=m,ie.jsx=function(i,r,g){var f=1e4>B.recentlyCreatedOwnerStacks++;return k(i,r,g,!1,f?Error("react-stack-top-frame"):Z,f?b(a(i)):V)},ie.jsxs=function(i,r,g){var f=1e4>B.recentlyCreatedOwnerStacks++;return k(i,r,g,!0,f?Error("react-stack-top-frame"):Z,f?b(a(i)):V)}})()),ie}var pe;function Oe(){return pe||(pe=1,process.env.NODE_ENV==="production"?se.exports=Ie():se.exports=je()),se.exports}var x=Oe();let _e=null;function ue(){return _e}function le(e){_e=e}function De(){le(null)}function Ne(e){const t=Me.create({baseURL:"http://localhost:3000/api/external",headers:{"Content-Type":"application/json"},withCredentials:!1});return t.interceptors.request.use(n=>{const a=e?.();return a&&(n.headers.Authorization=`Bearer ${a}`),n}),t}const J=Ne(ue),qe=async e=>{if(!e)throw new Error("token must be provided");return(await J.get("/integrations/validate-pat",{headers:{Authorization:`Bearer ${e}`}})).data},ze=async e=>{if(!e)throw new Error("boardId must be provided");return(await J.get(`/boards/${e}`)).data},Fe=async e=>{if(!e)throw new Error("boardId must be provided");return(await J.get(`/canvas-elements/${e}`)).data.canvasElements},Le=async e=>(await J.post("/canvas-elements",e)).data.canvasElement,Ue=async e=>{await J.delete(`/canvas-elements/${e}`)},Be=async e=>{if(!e)throw new Error("boardId must be provided");return(await J.post(`/boards/${e}/produce`)).data},$e=async(e,t)=>{if(!e||!t)throw new Error("boardId and jobId must be provided");return(await J.get(`/boards/${e}/produce/jobs/${t}`)).data};function Re(e,t){const n=t?.enabled??!0;return H.useQuery({queryKey:["board-editor",e],queryFn:async()=>{if(!e)throw new Error("Missing board id");return ze(e)},enabled:!!e&&n,retry:(a,s)=>{const o=s.response?.status;return o===401||o===403?!1:o===404?a<3:a<2},retryDelay:(a,s)=>s.response?.status===404?Math.min(300*2**a,2e3):Math.min(1e3*2**a,8e3),refetchOnWindowFocus:!1,refetchOnReconnect:!1,staleTime:3e4})}const We=250;function Ye(e){return typeof e.id=="number"?`id:${e.id}`:e.clientId?`client:${e.clientId}`:typeof e.canvasElementConfigId=="number"?`cfg:${e.canvasElementConfigId}`:`fallback:${e.type}:${e.variableName??""}`}function he(e,t){const n=t?.canEdit??!0,a=t?.enabled??!0,s=H.useQueryClient(),o=d.useRef(new Map),c=d.useRef(new Map),{data:p}=H.useQuery({queryKey:["canvas-elements",e],queryFn:async()=>Fe(e),enabled:!!e&&a,retry:(l,y)=>{const R=y.response?.status;return R===401||R===403||R===404?!1:l<1},refetchOnWindowFocus:!1,refetchOnReconnect:!1}),{mutate:w}=H.useMutation({mutationFn:Le,onSuccess:l=>{l.id&&s.setQueryData(["canvas-elements",e],(y=[])=>y.some(m=>m.id===l.id)?y.map(m=>m.id===l.id?l:m):[...y,l])}}),_=d.useCallback(l=>{if(!n){o.current.delete(l);return}const y=o.current.get(l);y&&(o.current.delete(l),w(y.element,{onSuccess:R=>{y.element.id||y.onCreated?.(R.id,R.canvasElementConfigId)}}))},[n,w]),k=d.useCallback((l,y,R)=>{if(!n)return;const m=Ye(l);o.current.set(m,{element:l,onCreated:y});let u=c.current.get(m);if(u||(u=Ae.debounce(()=>_(m),We),c.current.set(m,u)),R?.immediate){u.cancel(),_(m);return}u()},[n,_]);d.useEffect(()=>{const l=c.current,y=o.current;return()=>{for(const R of l.values())R.cancel();l.clear(),y.clear()}},[]);const{mutate:C}=H.useMutation({mutationFn:Ue,onSuccess:()=>{s.invalidateQueries({queryKey:["canvas-elements",e]})}}),I=d.useCallback((l,y)=>{n&&C(l,y)},[n,C]);return{canvasElements:p,upsertCanvasElement:k,deleteCanvasElement:I}}const Ke=2e3,He=2;function ye(e){return`produce-active-job:${e}`}function me(e){return e==="QUEUED"||e==="PROCESSING"}function we(e){const t=e.response?.data.error;return t&&t.length>0?t:e.message||"Failed to process PDF generation"}function Ce(e){const t=H.useQueryClient(),[n,a]=d.useState({}),s=d.useCallback((u,P)=>{if(typeof window>"u")return;const F=ye(u);if(P){window.localStorage.setItem(F,P);return}window.localStorage.removeItem(F)},[]),o=d.useCallback((u,P=e)=>{P&&(a(F=>{const j={...F};return u?j[P]=u:delete j[P],j}),s(P,u))},[e,s]),c=e?n[e]??(typeof window>"u"?null:window.localStorage.getItem(ye(e))):null,p=H.useMutation({onMutate:()=>{o(null)},mutationFn:async()=>{if(!e)throw new Error("Missing board id");return Be(e)},onSuccess:u=>{o(u.jobId)},onSettled:async()=>{await t.invalidateQueries({queryKey:["billing","summary"]})}}),w=H.useQuery({queryKey:["produce-status",e,c],queryFn:async()=>{if(!e||!c)throw new Error("Missing board or job id");const u=await $e(e,c);return u.jobId&&u.jobId!==c&&o(u.jobId),u},enabled:!!(e&&c),refetchInterval:u=>{const P=u.state.data?.status;return P&&me(P)?Ke:!1},retry:(u,P)=>{if(P.response?.status===404){const F=u<He;return F||o(null),F}return u<3},retryDelay:(u,P)=>P.response?.status===404?Math.min(500*2**u,4e3):Math.min(1e3*2**u,8e3)});d.useEffect(()=>{const u=w.data?.status;u!=="READY"&&u!=="FAILED"||t.invalidateQueries({queryKey:["billing","summary"]})},[w.data?.status,e,c,t]);const _=w.data?.status??p.data?.status??null,k=(()=>{const u=p.error;return u?u.response?.status!==422?[]:u.response?.data.missing??[]:[]})(),C=(()=>{const u=p.error;return!u||u.response?.status!==409?null:u.response?.data.jobId??null})(),I=d.useMemo(()=>w.error?we(w.error):p.error?we(p.error):w.data?.errorMessage??null,[w.error,w.data,p.error]),l=me(_),y=w.data?.progress??p.data?.progress??0,R=d.useCallback(u=>{o(u)},[o]),m=d.useCallback(()=>{o(null)},[o]);return{activeJobId:c,status:_,progress:y,isGenerating:l,isTriggering:p.isPending,isPolling:w.isFetching,downloadUrl:w.data?.downloadUrl,errorMessage:I,missingPrerequisites:k,conflictJobId:C,triggerGeneration:p.mutateAsync,refetchStatus:w.refetch,resumeFromJobId:R,clearActiveJob:m}}function Ge(e){const t={id:crypto.randomUUID(),x:220,y:140,width:220,height:40,rotation:0},n={fontFamily:"Poppins",fontWeight:"bold",italic:!1,underline:!1,fontSize:28,textAlign:"left",color:"#ffffff",opacity:1,coordinateSpace:"page"};switch(e){case"text":return{...t,type:e,text:"{{Variable_name}}",width:240,height:36,zIndex:0,properties:{...n,fontWeight:"bold",color:"#000000",bindingKey:"Variable_name"}};case"qr_code":return{...t,type:e,width:100,height:100,zIndex:0,data:"https://upload.wikimedia.org/wikipedia/commons/d/d0/QR_code_for_mobile_English_Wikipedia.svg",properties:{...n,fontWeight:"normal",color:"#000000",bindingKey:"qr_data",data:"https://upload.wikimedia.org/wikipedia/commons/d/d0/QR_code_for_mobile_English_Wikipedia.svg"}};case"bar_code":return{...t,type:e,width:240,height:32,zIndex:0,data:"BULK-0001",properties:{...n,fontWeight:"normal",color:"#000000",bindingKey:"barcode_data",data:"BULK-0001"}};case"image":return{...t,type:e,width:190,height:120,zIndex:0,src:"/logo.png",properties:{...n,fontWeight:"normal",color:"#000000",src:"/logo.png"}}}}const z=ke.create(e=>({elements:[],selectedId:null,dataSourceMeta:null,colorEyedropped:null,colorEyedropperActive:!1,setColorEyedropped:t=>e({colorEyedropped:t}),setColorEyedropperActive:t=>e({colorEyedropperActive:t}),addElement:t=>{const n=Ge(t);e(a=>({elements:[...a.elements,n],selectedId:n.id}))},updateElement:(t,n)=>e(a=>({elements:a.elements.map(s=>s.id===t?{...s,...n}:s)})),updateElementProperties:(t,n)=>e(a=>({elements:a.elements.map(s=>s.id===t?{...s,properties:{...s.properties,...n}}:s)})),updateDimensions:(t,n)=>e(a=>({elements:a.elements.map(s=>s.id===t?{...s,...n}:s)})),removeElement:t=>e(n=>({elements:n.elements.filter(a=>a.id!==t),selectedId:n.selectedId===t?null:n.selectedId})),bringForward:t=>e(n=>({elements:n.elements.map(a=>a.id===t?{...a,zIndex:a.zIndex+1}:a)})),sendBackward:t=>e(n=>({elements:n.elements.map(a=>a.id===t?{...a,zIndex:Math.max(0,a.zIndex-1)}:a)})),setSelectedId:t=>e({selectedId:t}),setDataSourceMeta:t=>e({dataSourceMeta:t}),mergeElements:t=>e(n=>{const a=new Set(n.elements.map(o=>o.dbId).filter(o=>o!==void 0)),s=t.filter(o=>o.dbId!==void 0&&!a.has(o.dbId));return s.length===0?n:{elements:[...n.elements,...s]}}),setElements:t=>e(n=>{if(!n.selectedId)return{elements:t,selectedId:null};const a=t.find(o=>o.id===n.selectedId);if(a)return{elements:t,selectedId:a.id};const s=n.elements.find(o=>o.id===n.selectedId);if(s?.dbId){const o=t.find(c=>c.dbId===s.dbId);return{elements:t,selectedId:o?.id??null}}return{elements:t,selectedId:null}}),assetUrl:null,setAssetUrl:t=>e({assetUrl:t})}));function Te(e,t){const n=t?.canEdit??!0,{upsertCanvasElement:a}=he(e,{canEdit:n}),s=z(h=>h.updateElement),o=d.useRef(null),c=d.useRef(null),[p,w]=d.useState({width:800,height:600}),[_,k]=d.useState(1),[C,I]=d.useState({x:0,y:0}),l=d.useRef(!1),y=d.useRef(null);d.useEffect(()=>{if(!c.current)return;const h=new ResizeObserver(()=>{const v=Math.max(c.current?.clientWidth??0,400),A=Math.max(c.current?.clientHeight??0,320),T=typeof window<"u"?window.innerHeight:900,M=Math.max(T-220,480);w({width:v,height:Math.min(A,M)})});return h.observe(c.current),()=>h.disconnect()},[]);const R=d.useCallback(h=>{const v=o.current;if(!v)return;h.evt.preventDefault();const A=_,T=v.getPointerPosition();if(!T)return;const M=1.08,L=Math.min(2.4,Math.max(.5,h.evt.deltaY>0?A/M:A*M)),B={x:(T.x-C.x)/A,y:(T.y-C.y)/A},$={x:T.x-B.x*L,y:T.y-B.y*L};k(L),I($)},[_,C]),m=d.useCallback(h=>{h.target===h.target.getStage()&&(l.current=!0,y.current=o.current?.getPointerPosition()??null)},[]),u=d.useCallback(()=>{if(!l.current)return;const h=o.current?.getPointerPosition();if(!h||!y.current)return;const v=h.x-y.current.x,A=h.y-y.current.y;I(T=>({x:T.x+v,y:T.y+A})),y.current=h},[]),P=d.useCallback(()=>{l.current=!1,y.current=null},[]),F=d.useCallback(h=>{c.current=h},[]),j=d.useCallback((h,v,A,T=h.properties)=>{n&&(s(h.id,{x:v,y:A}),a({id:h.dbId,clientId:h.id,canvasElementConfigId:h.configDbId,boardId:e,type:h.type,x:v,y:A,rotation:h.rotation,width:h.width,height:h.height,zIndex:h.zIndex,properties:T},(M,L)=>s(h.id,{dbId:M,configDbId:L}),{immediate:!0}))},[n,a,s,e]),X=d.useCallback((h,v,A=h.properties)=>{if(!n)return;const{x:T,y:M,width:L,height:B,rotation:$}=v;s(h.id,{x:T,y:M,rotation:$,width:L,height:B}),a({id:h.dbId,clientId:h.id,canvasElementConfigId:h.configDbId,boardId:e,type:h.type,x:T,y:M,rotation:$,width:L,height:B,zIndex:h.zIndex,properties:A},(D,b)=>s(h.id,{dbId:D,configDbId:b}),{immediate:!0})},[n,a,s,e]);return{stageRef:o,registerContainer:F,stageSize:p,stageScale:_,stagePosition:C,handleMouseDown:m,handleMouseMove:u,handleMouseUp:P,handleWheel:R,setStagePosition:I,handleDragEnd:j,handleTransformEnd:X}}const xe={width:595.28,height:841.89};function O(e){return!Number.isFinite(e)||e<=0?1:e}function be(e){return e*72/25.4}function Qe(e){let t;if(!e?.paperSize||e.paperSize==="A4")t=xe;else if(e.paperSize==="Long")t={width:612,height:1008};else if(e.paperSize==="Short")t={width:612,height:792};else if(e.paperSize==="Custom"){const n=e.customWidthMm??210,a=e.customHeightMm??297;t={width:be(n),height:be(a)}}else t=xe;return e?.orientation==="LANDSCAPE"?{width:t.height,height:t.width}:t}function Ve(e,t){const n=Math.max(1,Math.min(e.width,t.width)),a=Math.max(1,Math.min(e.height,t.height));return{x:Math.max(0,Math.min(e.x,t.width-n)),y:Math.max(0,Math.min(e.y,t.height-a)),width:n,height:a}}function ve(e,t,n){const a=O(n.width),s=O(n.height),o=O(t.width),c=O(t.height);return{x:t.x+e.x/a*o,y:t.y+e.y/s*c,width:e.width/a*o,height:e.height/s*c}}function de(e,t,n){const a=O(n.width),s=O(n.height),o=O(t.width),c=O(t.height),p={x:(e.x-t.x)/o*a,y:(e.y-t.y)/c*s,width:e.width/o*a,height:e.height/c*s};return Ve(p,n)}function Ee(e,t,n){return de(e,t,n)}function Je(e,t){const n=e.width*.8,a=e.height*.75,s=O(t.width)/O(t.height);let o=n,c=o/s;c>a&&(c=a,o=c*s);const p=(e.height-c)/2;return{x:(e.width-o)/2,y:Math.max(e.height*.1,p),width:o,height:c}}function Xe(e,t){const n=t.width??e.width*.8,a=t.height??e.height*.6,s=e.width*.8/O(n),o=e.height*.75/O(a),c=Math.min(s,o,1),p=n*c,w=a*c,_=(e.height-w)/2;return{x:(e.width-p)/2,y:Math.max(e.height*.1,_),width:p,height:w}}function Ze(e,t){const n=t.width??e.width,a=t.height??e.height,s=O(e.width),o=O(e.height),c=O(n),p=O(a),w=Math.min(s/c,o/p),_=c*w,k=p*w;return{x:e.x+(s-_)/2,y:e.y+(o-k)/2,width:_,height:k}}function et({sharedProps:e,src:t,placeholder:n,width:a,height:s,opacity:o}){const[c]=oe(t??"","anonymous");return x.jsx(q.Image,{...e,image:t?c:n,width:a,height:s,opacity:o})}const tt=/\.(png|jpe?g|gif|webp|bmp|svg|avif|tiff?)(\?.*)?$/i;function rt(e){return/^https?:\/\//i.test(e)?tt.test(e):!1}const nt={text:"Text",qr_code:"QR Code",bar_code:"Bar Code",image:"Image"},it=`data:image/svg+xml;utf8,${encodeURIComponent(`
7
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120">
8
+ <rect width="120" height="120" fill="#ffffff"/>
9
+ <rect x="8" y="8" width="32" height="32" fill="#111827"/>
10
+ <rect x="13" y="13" width="22" height="22" fill="#ffffff"/>
11
+ <rect x="18" y="18" width="12" height="12" fill="#111827"/>
12
+ <rect x="80" y="8" width="32" height="32" fill="#111827"/>
13
+ <rect x="85" y="13" width="22" height="22" fill="#ffffff"/>
14
+ <rect x="90" y="18" width="12" height="12" fill="#111827"/>
15
+ <rect x="8" y="80" width="32" height="32" fill="#111827"/>
16
+ <rect x="13" y="85" width="22" height="22" fill="#ffffff"/>
17
+ <rect x="18" y="90" width="12" height="12" fill="#111827"/>
18
+ <rect x="50" y="50" width="8" height="8" fill="#111827"/>
19
+ <rect x="62" y="50" width="8" height="8" fill="#111827"/>
20
+ <rect x="50" y="62" width="8" height="8" fill="#111827"/>
21
+ <rect x="74" y="62" width="8" height="8" fill="#111827"/>
22
+ <rect x="62" y="74" width="8" height="8" fill="#111827"/>
23
+ <rect x="86" y="50" width="8" height="8" fill="#111827"/>
24
+ <rect x="74" y="86" width="8" height="8" fill="#111827"/>
25
+ <rect x="94" y="74" width="8" height="8" fill="#111827"/>
26
+ </svg>
27
+ `)}`,ot=`data:image/svg+xml;utf8,${encodeURIComponent(`
28
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 80">
29
+ <rect width="240" height="80" fill="#ffffff"/>
30
+ <g fill="#111827">
31
+ <rect x="18" y="10" width="4" height="52"/>
32
+ <rect x="26" y="10" width="2" height="52"/>
33
+ <rect x="32" y="10" width="6" height="52"/>
34
+ <rect x="42" y="10" width="3" height="52"/>
35
+ <rect x="49" y="10" width="5" height="52"/>
36
+ <rect x="58" y="10" width="2" height="52"/>
37
+ <rect x="64" y="10" width="7" height="52"/>
38
+ <rect x="75" y="10" width="3" height="52"/>
39
+ <rect x="82" y="10" width="6" height="52"/>
40
+ <rect x="92" y="10" width="2" height="52"/>
41
+ <rect x="98" y="10" width="5" height="52"/>
42
+ <rect x="108" y="10" width="4" height="52"/>
43
+ <rect x="116" y="10" width="2" height="52"/>
44
+ <rect x="122" y="10" width="6" height="52"/>
45
+ <rect x="132" y="10" width="3" height="52"/>
46
+ <rect x="139" y="10" width="5" height="52"/>
47
+ <rect x="148" y="10" width="2" height="52"/>
48
+ <rect x="154" y="10" width="7" height="52"/>
49
+ <rect x="165" y="10" width="3" height="52"/>
50
+ <rect x="172" y="10" width="5" height="52"/>
51
+ <rect x="181" y="10" width="2" height="52"/>
52
+ <rect x="187" y="10" width="6" height="52"/>
53
+ <rect x="197" y="10" width="3" height="52"/>
54
+ <rect x="204" y="10" width="5" height="52"/>
55
+ <rect x="213" y="10" width="4" height="52"/>
56
+ </g>
57
+ <text x="120" y="74" text-anchor="middle" font-family="Arial, sans-serif" font-size="12" fill="#6b7280">123456789012</text>
58
+ </svg>
59
+ `)}`,at=`data:image/svg+xml;utf8,${encodeURIComponent(`
60
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 100">
61
+ <rect width="160" height="100" fill="#f3f4f6"/>
62
+ <rect x="6" y="6" width="148" height="88" rx="8" fill="#ffffff" stroke="#cbd5e1" stroke-width="2"/>
63
+ <circle cx="48" cy="35" r="10" fill="#d1d5db"/>
64
+ <path d="M20 78 L58 50 L78 66 L98 56 L138 78 Z" fill="#cbd5e1"/>
65
+ <path d="M20 78 L44 62 L62 74 L84 58 L118 78 Z" fill="#9ca3af" opacity="0.9"/>
66
+ </svg>
67
+ `)}`;function st({boardId:e,board:t,canEdit:n=!0}){const{registerContainer:a,stageRef:s,stageSize:o,stageScale:c,stagePosition:p,handleMouseDown:w,handleMouseMove:_,handleMouseUp:k,handleWheel:C,handleDragEnd:I,handleTransformEnd:l}=Te(e,{canEdit:n}),y=z(r=>r.elements),R=z(r=>r.selectedId),m=z(r=>r.setSelectedId),u=z(r=>r.updateElement),P=z(r=>r.assetUrl),F=z(r=>r.dataSourceMeta),j=z(r=>r.colorEyedropperActive),X=z(r=>r.setColorEyedropped),h=z(r=>r.setColorEyedropperActive),v=d.useMemo(()=>y.find(r=>r.id===R)??null,[y,R]),A=d.useRef(0),T=d.useCallback(r=>{m(r)},[m]),[M]=oe(P??"","anonymous"),[L]=oe(it,"anonymous"),[B]=oe(ot,"anonymous"),[$]=oe(at,"anonymous"),D=d.useMemo(()=>Qe({...t?.config,orientation:t?.orientation}),[t?.config,t?.orientation]),b=d.useMemo(()=>Je(o,D),[o,D]),G=d.useMemo(()=>Xe(o,{width:M?.width,height:M?.height}),[o,M]),Q=d.useMemo(()=>M?Ze(b,{width:M.width,height:M.height}):b,[M,b]),Z=d.useMemo(()=>{if(!v)return null;const r=v.properties.coordinateSpace==="page"?{x:v.x,y:v.y,width:v.width,height:v.height}:Ee({x:v.x,y:v.y,width:v.width,height:v.height},G,D);return ve(r,b,D)},[v,G,D,b]),V=d.useMemo(()=>({x:b.x+10,y:b.y+10,width:b.width-20,height:b.height-20}),[b]),re=d.useCallback(r=>{if(!j)return!1;const g=s.current,f=g?.getPointerPosition(),U=g?.getLayers()[0]?.getNativeCanvasElement(),S=U?.getContext("2d");if(r.cancelBubble=!0,r.evt.preventDefault(),!g||!f||!U||!S)return!0;const K=Math.max(0,Math.min(U.width-1,Math.round(f.x/Math.max(1,g.width())*U.width))),N=Math.max(0,Math.min(U.height-1,Math.round(f.y/Math.max(1,g.height())*U.height))),[E,ee,Y,ae]=S.getImageData(K,N,1,1).data;return ae===0||(A.current=Date.now()+250,X(`#${[E,ee,Y].map(Pe=>Pe.toString(16).padStart(2,"0")).join("")}`),h(!1)),!0},[j,X,h,s]),i=d.useCallback(r=>{const g=r.properties.coordinateSpace==="page"?{x:r.x,y:r.y,width:r.width,height:r.height}:Ee({x:r.x,y:r.y,width:r.width,height:r.height},G,D),f=ve(g,b,D),W={id:r.id,x:f.x,y:f.y,width:f.width,height:f.height,draggable:n&&!j,onClick:()=>{Date.now()<A.current||j||T(r.id)},onTap:()=>{Date.now()<A.current||j||T(r.id)},onDragEnd:N=>{if(!n||j)return;const E=de({x:N.target.x(),y:N.target.y(),width:f.width,height:f.height},b,D),ee={...r.properties,coordinateSpace:"page"};u(r.id,{x:E.x,y:E.y,width:E.width,height:E.height,properties:ee}),I(r,E.x,E.y,ee)},onDragMove:N=>{if(!n||j)return;const E=de({x:N.target.x(),y:N.target.y(),width:f.width,height:f.height},b,D);u(r.id,{x:E.x,y:E.y,width:E.width,height:E.height,properties:{...r.properties,coordinateSpace:"page"}})},onTransformEnd:N=>{if(!n||j)return;const E=N.target,ee={x:E.x(),y:E.y(),width:E.width()*E.scaleX(),height:E.height()*E.scaleY()};E.scaleX(1),E.scaleY(1);const Y=de(ee,b,D),ae={...r.properties,coordinateSpace:"page"};u(r.id,{x:Y.x,y:Y.y,width:Y.width,height:Y.height,properties:ae}),l(r,{x:Y.x,y:Y.y,width:Y.width,height:Y.height,rotation:E.rotation()},ae)}},U=typeof r.properties.bindingKey=="string"?r.properties.bindingKey:null,S=U?F?.previewRow[U]??null:null;if(S?rt(S):!1)return x.jsx(q.Image,{...W,image:$??void 0,width:f.width,height:f.height,opacity:r.properties.opacity},r.id);if(r.type==="text"){const N=[r.properties.fontWeight,r.properties.italic?"italic":""].join(" ").trim(),E=r.properties.underline?"underline":"";return x.jsx(q.Text,{...W,text:r.text??"{{Text}}",fontSize:r.properties.fontSize,fontFamily:r.properties.fontFamily,fontStyle:N,textDecoration:E,fill:r.properties.color,padding:8,align:r.properties.textAlign,verticalAlign:"middle",opacity:r.properties.opacity},r.id)}return r.type==="qr_code"?x.jsx(q.Image,{...W,image:L??void 0,width:f.width,height:f.height,opacity:r.properties.opacity},r.id):r.type==="bar_code"?x.jsx(q.Image,{...W,image:B??void 0,width:f.width,height:f.height,opacity:r.properties.opacity},r.id):x.jsx(et,{sharedProps:W,src:r.properties.src??r.src,placeholder:$??void 0,width:f.width,height:f.height,opacity:r.properties.opacity},r.id)},[T,I,l,u,b,D,G,L,B,$,n,F,j]);return x.jsx("div",{className:"formiq-board-canvas",children:x.jsx("div",{id:"formiq-board-canvas",ref:a,className:"formiq-board-canvas__stage",style:{backgroundColor:"#f3f5fb",backgroundImage:"radial-gradient(rgba(15,23,42,0.12) 1.7px, transparent 1px)",backgroundSize:"32px 32px",cursor:j?"crosshair":"default"},children:x.jsx(q.Stage,{ref:s,width:o.width,height:o.height,x:p.x,y:p.y,scaleX:c,scaleY:c,onWheel:C,onMouseDown:r=>{re(r)||w(r)},onMouseMove:_,onMouseUp:k,onTouchStart:re,onTouchEnd:k,onMouseLeave:k,onTouchMove:_,children:x.jsxs(q.Layer,{children:[x.jsx(q.Rect,{x:b.x,y:b.y,width:b.width,height:b.height,cornerRadius:20,fill:"#ffffff",shadowColor:"#0f172a",shadowBlur:16,shadowOpacity:.12}),M?x.jsx(q.Image,{image:M,x:Q.x,y:Q.y,width:Q.width,height:Q.height,cornerRadius:20}):x.jsx(q.Rect,{x:b.x,y:b.y,width:b.width,height:b.height,cornerRadius:20,fillLinearGradientColorStops:[0,"#03072b",.55,"#0b2b64",1,"#031a4c"],shadowColor:"#0f172a",shadowBlur:40}),x.jsx(q.Rect,{x:V.x,y:V.y,width:V.width,height:V.height,cornerRadius:18,stroke:"#7dd3fc",strokeWidth:2,dash:[10,6],opacity:.5}),y.slice().sort((r,g)=>r.zIndex-g.zIndex).map(r=>i(r)),v&&Z&&x.jsxs(q.Label,{x:Math.max(Z.x,0),y:Math.max(Z.y-28,0),listening:!1,children:[x.jsx(q.Tag,{fill:"#2563eb",cornerRadius:4}),x.jsx(q.Text,{text:nt[v.type],fontSize:12,fill:"#fff",padding:6})]}),n&&R&&x.jsx(q.Transformer,{ref:r=>{if(!r)return;const f=r.getStage()?.findOne(`#${R}`);r.nodes(f?[f]:[])},boundBoxFunc:(r,g)=>({...g,width:Math.max(g.width,20),height:Math.max(g.height,20)})})]})})})})}const te={fontFamily:"Poppins",italic:!1,underline:!1,fontSize:24,color:"#ffffff",opacity:1};function ct(e){return e==="center"||e==="right"?e:"left"}function dt(e){return e==="bold"?"bold":"normal"}function ce(e,t=!1){return typeof e=="boolean"?e:t}function Se(e){const t=e.properties??{},n={fontFamily:typeof t.fontFamily=="string"?t.fontFamily:te.fontFamily,fontWeight:dt(t.fontWeight),italic:ce(t.italic,ce(t.isItalicText,te.italic)),underline:ce(t.underline,ce(t.isUnderlineText,te.underline)),fontSize:typeof t.fontSize=="number"?t.fontSize:te.fontSize,textAlign:ct(t.textAlign),color:typeof t.color=="string"?t.color:te.color,opacity:typeof t.opacity=="number"?t.opacity:te.opacity,coordinateSpace:t.coordinateSpace==="page"?"page":"stage",bindingKey:typeof t.bindingKey=="string"?t.bindingKey:typeof t.bindingKey=="number"?String(t.bindingKey):void 0,data:typeof t.data=="string"?t.data:typeof e.data=="string"?e.data:void 0,src:typeof t.src=="string"?t.src:typeof e.src=="string"?e.src:void 0,isIncrementalVariable:typeof t.isIncrementalVariable=="boolean"?t.isIncrementalVariable:!1,generationType:t.generationType==="alphanumeric"||t.generationType==="integer"?t.generationType:void 0,incrementCount:typeof t.incrementCount=="number"&&Number.isFinite(t.incrementCount)?t.incrementCount:void 0,incrementStart:typeof t.incrementStart=="number"&&Number.isFinite(t.incrementStart)?t.incrementStart:void 0,incrementPadLength:typeof t.incrementPadLength=="number"&&Number.isFinite(t.incrementPadLength)?t.incrementPadLength:void 0,incrementSeed:typeof t.incrementSeed=="string"?t.incrementSeed:void 0};return{id:e.id.toString(),dbId:e.id,configDbId:e.canvasElementConfigId,type:e.type,x:e.x,y:e.y,rotation:e.rotation??0,width:e.width,height:e.height,zIndex:e.zIndex,generationType:n.generationType,text:typeof t.text=="string"?t.text:e.type==="text"&&n.bindingKey?`{{${n.bindingKey}}}`:void 0,data:n.data,src:n.src,properties:n}}function ut(e){if(!e)return null;const t=Array.isArray(e.columnHeaders)?e.columnHeaders:[],n=Array.isArray(e.parsedData)&&e.parsedData.length?e.parsedData[0]:{};return{columnHeaders:t,previewRow:n}}function lt({boardId:e,canEdit:t=!0}){const[n,a]=d.useState(null),[s,o]=d.useState(!1),c=z(m=>m.setElements),p=z(m=>m.mergeElements),w=z(m=>m.setDataSourceMeta),_=z(m=>m.setAssetUrl),k=d.useRef(!1);d.useEffect(()=>{const m=ue();a(m),o(!0)},[]);const C=Re(e,{enabled:!!(s&&n)}),{canvasElements:I}=he(e,{enabled:!!(s&&n)}),l=Ce(e),y=d.useMemo(()=>C.data?C.data.board.boardName:"Board",[C.data]);d.useEffect(()=>{if(!C.data?.board){c([]),w(null),_(null);return}const{board:m}=C.data;w(ut(m.dataSource)),_(m.asset?.fileUrl??null)},[C.data,c,w,_]),d.useEffect(()=>{if(I){if(!k.current){c(I.map(Se)),k.current=!0;return}p(I.map(Se))}},[I,c,p]);async function R(){if(l.status==="READY"&&l.downloadUrl){window.open(l.downloadUrl,"_blank","noopener,noreferrer");return}await l.triggerGeneration()}return x.jsxs("div",{className:"formiq-board",children:[x.jsxs("div",{className:"formiq-board__header",children:[x.jsx("div",{className:"formiq-board__title",children:y}),x.jsxs("div",{className:"formiq-board__actions",children:[x.jsx("button",{type:"button",className:"formiq-board__button",onClick:R,disabled:l.isTriggering||l.isGenerating||!n,children:l.isGenerating?`Generating ${l.progress}%`:"Generate PDF"}),l.downloadUrl&&l.status==="READY"&&x.jsx("button",{type:"button",className:"formiq-board__button formiq-board__button--ghost",onClick:()=>window.open(l.downloadUrl,"_blank","noopener,noreferrer"),children:"Download PDF"})]})]}),C.isError&&x.jsx("div",{className:"formiq-board__error",children:"Failed to load board. Check your PAT and board id."}),!n&&x.jsxs("div",{className:"formiq-board__empty",children:["No PAT provided. Wrap this component with ",x.jsx("code",{children:'<FormiqProvider token="...">'}),"."]}),n&&x.jsx("div",{className:"formiq-board__canvas",children:x.jsx(st,{boardId:e,board:C.data?.board,canEdit:t})})]})}function ht({token:e,children:t}){const n=d.useMemo(()=>e.trim(),[e]);return d.useEffect(()=>{n&&le(n)},[n]),x.jsx(x.Fragment,{children:t})}function ft(e){return H.useQuery({queryKey:["validate-pat",e],queryFn:()=>qe(e??""),enabled:!!e,staleTime:6e4})}exports.BoardEditor=lt;exports.FormiqProvider=ht;exports.clearPersonalAccessToken=De;exports.getPersonalAccessToken=ue;exports.setPersonalAccessToken=le;exports.useBoardCanvas=Te;exports.useBoardEditor=Re;exports.useCanvasElement=he;exports.useCanvasStore=z;exports.useProduce=Ce;exports.useValidatePat=ft;