notra-editor 0.8.0 → 0.8.2

package/dist/components/heading-dropdown-menu/heading-menu-item.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading';\nimport { DropdownMenuItem } from '../ui/dropdown-menu';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBG;AApBH,mBAA2B;AAE3B,yBAA8C;AAC9C,2BAAiC;AAS1B,MAAM,sBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,QAAI,+BAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,sDAAC,QAAK;AAAA,UACN,4CAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading.js';\nimport { DropdownMenuItem } from '../ui/dropdown-menu.js';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2B;AAE3B,yBAA8C;AAC9C,2BAAiC;AAiB9B;AARI,IAAM,sBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,QAAI,+BAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,sDAAC,QAAK;AAAA,UACN,4CAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}

package/dist/components/heading-dropdown-menu/heading-menu-item.mjs

@@ -1,8 +1,9 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/heading-dropdown-menu/heading-menu-item.tsx
 import { forwardRef } from "react";
-import { useHeading } from "./use-heading";
-import { DropdownMenuItem } from "../ui/dropdown-menu";
-const HeadingMenuItem = forwardRef(
+import { useHeading } from "./use-heading.mjs";
+import { DropdownMenuItem } from "../ui/dropdown-menu.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+var HeadingMenuItem = forwardRef(
   ({ editor, level }, ref) => {
     const { isActive, canToggle, handleToggle, label, Icon } = useHeading({
       editor,

package/dist/components/heading-dropdown-menu/heading-menu-item.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading';\nimport { DropdownMenuItem } from '../ui/dropdown-menu';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":"AAoBG,SAQC,KARD;AApBH,SAAS,kBAAkB;AAE3B,SAAS,kBAAqC;AAC9C,SAAS,wBAAwB;AAS1B,MAAM,kBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,IAAI,WAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,8BAAC,QAAK;AAAA,UACN,oBAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading.js';\nimport { DropdownMenuItem } from '../ui/dropdown-menu.js';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,SAAS,kBAAqC;AAC9C,SAAS,wBAAwB;AAiB9B,SAQC,KARD;AARI,IAAM,kBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,IAAI,WAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,8BAAC,QAAK;AAAA,UACN,oBAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}

package/dist/components/heading-dropdown-menu/use-heading.cjs

@@ -16,6 +16,8 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/heading-dropdown-menu/use-heading.ts
 var use_heading_exports = {};
 __export(use_heading_exports, {
   getHeadingTriggerIcon: () => getHeadingTriggerIcon,
@@ -25,13 +27,13 @@ __export(use_heading_exports, {
 module.exports = __toCommonJS(use_heading_exports);
 var import_lucide_react = require("lucide-react");
 var import_react = require("react");
-const headingIcons = {
+var headingIcons = {
   1: import_lucide_react.Heading1,
   2: import_lucide_react.Heading2,
   3: import_lucide_react.Heading3,
   4: import_lucide_react.Heading4
 };
-const headingLabels = {
+var headingLabels = {
   1: "Heading 1",
   2: "Heading 2",
   3: "Heading 3",

package/dist/components/heading-dropdown-menu/use-heading.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAgE;AAChE,mBAAiD;AASjD,MAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,MAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAEhD,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAM,mBAAe,0BAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,QAAI,uBAA8B,IAAI;AAExE,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}
+{"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAgE;AAChE,mBAAiD;AASjD,IAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,IAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAEhD,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAM,mBAAe,0BAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,QAAI,uBAA8B,IAAI;AAExE,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}

package/dist/components/heading-dropdown-menu/use-heading.mjs

@@ -1,12 +1,13 @@
+// src/components/heading-dropdown-menu/use-heading.ts
 import { Heading, Heading1, Heading2, Heading3, Heading4 } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
-const headingIcons = {
+var headingIcons = {
   1: Heading1,
   2: Heading2,
   3: Heading3,
   4: Heading4
 };
-const headingLabels = {
+var headingLabels = {
   1: "Heading 1",
   2: "Heading 2",
   3: "Heading 3",

package/dist/components/heading-dropdown-menu/use-heading.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":"AAAA,SAAS,SAAS,UAAU,UAAU,UAAU,gBAAgB;AAChE,SAAS,aAAa,WAAW,gBAAgB;AASjD,MAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,MAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAM,eAAe,YAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,IAAI,SAA8B,IAAI;AAExE,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}
+{"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":";AAAA,SAAS,SAAS,UAAU,UAAU,UAAU,gBAAgB;AAChE,SAAS,aAAa,WAAW,gBAAgB;AASjD,IAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,IAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAM,eAAe,YAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,IAAI,SAA8B,IAAI;AAExE,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}

package/dist/components/image-popover/image-input-form.cjs

@@ -0,0 +1,127 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/image-popover/image-input-form.tsx
+var image_input_form_exports = {};
+__export(image_input_form_exports, {
+  ImageInputForm: () => ImageInputForm
+});
+module.exports = __toCommonJS(image_input_form_exports);
+var import_lucide_react = require("lucide-react");
+var import_react = require("react");
+var import_button = require("../ui/button.cjs");
+var import_input = require("../ui/input.cjs");
+var import_separator = require("../ui/separator.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+function ImageInputForm({
+  initialUrl = "",
+  initialAlt = "",
+  showRemove = false,
+  onSubmit,
+  onRemove,
+  onCancel
+}) {
+  const [url, setUrl] = (0, import_react.useState)(initialUrl);
+  const [alt, setAlt] = (0, import_react.useState)(initialAlt);
+  (0, import_react.useEffect)(() => {
+    setUrl(initialUrl);
+  }, [initialUrl]);
+  (0, import_react.useEffect)(() => {
+    setAlt(initialAlt);
+  }, [initialAlt]);
+  const submit = (0, import_react.useCallback)(() => {
+    onSubmit({ url, alt });
+  }, [url, alt, onSubmit]);
+  const handleKeyDown = (0, import_react.useCallback)(
+    (event) => {
+      if (event.key === "Enter") {
+        event.preventDefault();
+        submit();
+        return;
+      }
+      if (event.key === "Escape" && onCancel) {
+        event.preventDefault();
+        onCancel();
+      }
+    },
+    [submit, onCancel]
+  );
+  const submitDisabled = !url && !showRemove;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_input.Input,
+      {
+        autoFocus: true,
+        className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
+        placeholder: "Paste image URL...",
+        type: "url",
+        value: url,
+        onChange: (e) => setUrl(e.target.value),
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_input.Input,
+      {
+        className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
+        placeholder: "Alt text (optional)",
+        type: "text",
+        value: alt,
+        onChange: (e) => setAlt(e.target.value),
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "nt:flex nt:items-center nt:justify-end nt:gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_button.Button,
+        {
+          "aria-label": "Apply image",
+          disabled: submitDisabled,
+          size: "icon-sm",
+          tabIndex: -1,
+          type: "button",
+          variant: "ghost",
+          onClick: submit,
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.CornerDownLeft, {})
+        }
+      ),
+      showRemove && onRemove && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator.Separator, { className: "nt:h-5", orientation: "vertical" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_button.Button,
+          {
+            "aria-label": "Remove image",
+            size: "icon-sm",
+            tabIndex: -1,
+            type: "button",
+            variant: "ghost",
+            onClick: onRemove,
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Trash2, {})
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ImageInputForm
+});
+//# sourceMappingURL=image-input-form.cjs.map

package/dist/components/image-popover/image-input-form.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/image-popover/image-input-form.tsx"],"sourcesContent":["'use client';\n\nimport { CornerDownLeft, Trash2 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { Button } from '../ui/button.js';\nimport { Input } from '../ui/input.js';\nimport { Separator } from '../ui/separator.js';\n\nexport interface ImageInputFormProps {\n\tinitialUrl?: string;\n\tinitialAlt?: string;\n\tshowRemove?: boolean;\n\tonSubmit: (values: { url: string; alt: string }) => void;\n\tonRemove?: () => void;\n\tonCancel?: () => void;\n}\n\nexport function ImageInputForm({\n\tinitialUrl = '',\n\tinitialAlt = '',\n\tshowRemove = false,\n\tonSubmit,\n\tonRemove,\n\tonCancel\n}: ImageInputFormProps) {\n\tconst [url, setUrl] = useState(initialUrl);\n\tconst [alt, setAlt] = useState(initialAlt);\n\n\tuseEffect(() => {\n\t\tsetUrl(initialUrl);\n\t}, [initialUrl]);\n\n\tuseEffect(() => {\n\t\tsetAlt(initialAlt);\n\t}, [initialAlt]);\n\n\tconst submit = useCallback(() => {\n\t\tonSubmit({ url, alt });\n\t}, [url, alt, onSubmit]);\n\n\tconst handleKeyDown = useCallback(\n\t\t(event: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (event.key === 'Enter') {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tsubmit();\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === 'Escape' && onCancel) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonCancel();\n\t\t\t}\n\t\t},\n\t\t[submit, onCancel]\n\t);\n\n\tconst submitDisabled = !url && !showRemove;\n\n\treturn (\n\t\t<div className=\"nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1\">\n\t\t\t<Input\n\t\t\t\tautoFocus\n\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\tplaceholder=\"Paste image URL...\"\n\t\t\t\ttype=\"url\"\n\t\t\t\tvalue={url}\n\t\t\t\tonChange={(e) => setUrl(e.target.value)}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t/>\n\t\t\t<Input\n\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\tplaceholder=\"Alt text (optional)\"\n\t\t\t\ttype=\"text\"\n\t\t\t\tvalue={alt}\n\t\t\t\tonChange={(e) => setAlt(e.target.value)}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t/>\n\t\t\t<div className=\"nt:flex nt:items-center nt:justify-end nt:gap-1\">\n\t\t\t\t<Button\n\t\t\t\t\taria-label=\"Apply image\"\n\t\t\t\t\tdisabled={submitDisabled}\n\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tonClick={submit}\n\t\t\t\t>\n\t\t\t\t\t<CornerDownLeft />\n\t\t\t\t</Button>\n\t\t\t\t{showRemove && onRemove && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<Separator className=\"nt:h-5\" orientation=\"vertical\" />\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\taria-label=\"Remove image\"\n\t\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tonClick={onRemove}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Trash2 />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,0BAAuC;AACvC,mBAAiD;AAEjD,oBAAuB;AACvB,mBAAsB;AACtB,uBAA0B;AAuDvB;AA5CI,SAAS,eAAe;AAAA,EAC9B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,UAAU;AACzC,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,UAAU;AAEzC,8BAAU,MAAM;AACf,WAAO,UAAU;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,8BAAU,MAAM;AACf,WAAO,UAAU;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,aAAS,0BAAY,MAAM;AAChC,aAAS,EAAE,KAAK,IAAI,CAAC;AAAA,EACtB,GAAG,CAAC,KAAK,KAAK,QAAQ,CAAC;AAEvB,QAAM,oBAAgB;AAAA,IACrB,CAAC,UAAiD;AACjD,UAAI,MAAM,QAAQ,SAAS;AAC1B,cAAM,eAAe;AACrB,eAAO;AAEP;AAAA,MACD;AAEA,UAAI,MAAM,QAAQ,YAAY,UAAU;AACvC,cAAM,eAAe;AACrB,iBAAS;AAAA,MACV;AAAA,IACD;AAAA,IACA,CAAC,QAAQ,QAAQ;AAAA,EAClB;AAEA,QAAM,iBAAiB,CAAC,OAAO,CAAC;AAEhC,SACC,6CAAC,SAAI,WAAU,+CACd;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAS;AAAA,QACT,WAAU;AAAA,QACV,aAAY;AAAA,QACZ,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,QACtC,WAAW;AAAA;AAAA,IACZ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,aAAY;AAAA,QACZ,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,QACtC,WAAW;AAAA;AAAA,IACZ;AAAA,IACA,6CAAC,SAAI,WAAU,mDACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,cAAW;AAAA,UACX,UAAU;AAAA,UACV,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,SAAS;AAAA,UAET,sDAAC,sCAAe;AAAA;AAAA,MACjB;AAAA,MACC,cAAc,YACd,4EACC;AAAA,oDAAC,8BAAU,WAAU,UAAS,aAAY,YAAW;AAAA,QACrD;AAAA,UAAC;AAAA;AAAA,YACA,cAAW;AAAA,YACX,MAAK;AAAA,YACL,UAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,SAAS;AAAA,YAET,sDAAC,8BAAO;AAAA;AAAA,QACT;AAAA,SACD;AAAA,OAEF;AAAA,KACD;AAEF;","names":[]}

package/dist/components/image-popover/image-input-form.d.cts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface ImageInputFormProps {
+    initialUrl?: string;
+    initialAlt?: string;
+    showRemove?: boolean;
+    onSubmit: (values: {
+        url: string;
+        alt: string;
+    }) => void;
+    onRemove?: () => void;
+    onCancel?: () => void;
+}
+declare function ImageInputForm({ initialUrl, initialAlt, showRemove, onSubmit, onRemove, onCancel }: ImageInputFormProps): react_jsx_runtime.JSX.Element;
+
+export { ImageInputForm, type ImageInputFormProps };

package/dist/components/image-popover/image-input-form.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface ImageInputFormProps {
+    initialUrl?: string;
+    initialAlt?: string;
+    showRemove?: boolean;
+    onSubmit: (values: {
+        url: string;
+        alt: string;
+    }) => void;
+    onRemove?: () => void;
+    onCancel?: () => void;
+}
+declare function ImageInputForm({ initialUrl, initialAlt, showRemove, onSubmit, onRemove, onCancel }: ImageInputFormProps): react_jsx_runtime.JSX.Element;
+
+export { ImageInputForm, type ImageInputFormProps };

package/dist/components/image-popover/image-input-form.mjs

@@ -0,0 +1,103 @@
+"use client";
+
+// src/components/image-popover/image-input-form.tsx
+import { CornerDownLeft, Trash2 } from "lucide-react";
+import { useCallback, useEffect, useState } from "react";
+import { Button } from "../ui/button.mjs";
+import { Input } from "../ui/input.mjs";
+import { Separator } from "../ui/separator.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function ImageInputForm({
+  initialUrl = "",
+  initialAlt = "",
+  showRemove = false,
+  onSubmit,
+  onRemove,
+  onCancel
+}) {
+  const [url, setUrl] = useState(initialUrl);
+  const [alt, setAlt] = useState(initialAlt);
+  useEffect(() => {
+    setUrl(initialUrl);
+  }, [initialUrl]);
+  useEffect(() => {
+    setAlt(initialAlt);
+  }, [initialAlt]);
+  const submit = useCallback(() => {
+    onSubmit({ url, alt });
+  }, [url, alt, onSubmit]);
+  const handleKeyDown = useCallback(
+    (event) => {
+      if (event.key === "Enter") {
+        event.preventDefault();
+        submit();
+        return;
+      }
+      if (event.key === "Escape" && onCancel) {
+        event.preventDefault();
+        onCancel();
+      }
+    },
+    [submit, onCancel]
+  );
+  const submitDisabled = !url && !showRemove;
+  return /* @__PURE__ */ jsxs("div", { className: "nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1", children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        autoFocus: true,
+        className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
+        placeholder: "Paste image URL...",
+        type: "url",
+        value: url,
+        onChange: (e) => setUrl(e.target.value),
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
+        placeholder: "Alt text (optional)",
+        type: "text",
+        value: alt,
+        onChange: (e) => setAlt(e.target.value),
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "nt:flex nt:items-center nt:justify-end nt:gap-1", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          "aria-label": "Apply image",
+          disabled: submitDisabled,
+          size: "icon-sm",
+          tabIndex: -1,
+          type: "button",
+          variant: "ghost",
+          onClick: submit,
+          children: /* @__PURE__ */ jsx(CornerDownLeft, {})
+        }
+      ),
+      showRemove && onRemove && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Separator, { className: "nt:h-5", orientation: "vertical" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            "aria-label": "Remove image",
+            size: "icon-sm",
+            tabIndex: -1,
+            type: "button",
+            variant: "ghost",
+            onClick: onRemove,
+            children: /* @__PURE__ */ jsx(Trash2, {})
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  ImageInputForm
+};
+//# sourceMappingURL=image-input-form.mjs.map

package/dist/components/image-popover/image-input-form.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/image-popover/image-input-form.tsx"],"sourcesContent":["'use client';\n\nimport { CornerDownLeft, Trash2 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { Button } from '../ui/button.js';\nimport { Input } from '../ui/input.js';\nimport { Separator } from '../ui/separator.js';\n\nexport interface ImageInputFormProps {\n\tinitialUrl?: string;\n\tinitialAlt?: string;\n\tshowRemove?: boolean;\n\tonSubmit: (values: { url: string; alt: string }) => void;\n\tonRemove?: () => void;\n\tonCancel?: () => void;\n}\n\nexport function ImageInputForm({\n\tinitialUrl = '',\n\tinitialAlt = '',\n\tshowRemove = false,\n\tonSubmit,\n\tonRemove,\n\tonCancel\n}: ImageInputFormProps) {\n\tconst [url, setUrl] = useState(initialUrl);\n\tconst [alt, setAlt] = useState(initialAlt);\n\n\tuseEffect(() => {\n\t\tsetUrl(initialUrl);\n\t}, [initialUrl]);\n\n\tuseEffect(() => {\n\t\tsetAlt(initialAlt);\n\t}, [initialAlt]);\n\n\tconst submit = useCallback(() => {\n\t\tonSubmit({ url, alt });\n\t}, [url, alt, onSubmit]);\n\n\tconst handleKeyDown = useCallback(\n\t\t(event: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (event.key === 'Enter') {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tsubmit();\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (event.key === 'Escape' && onCancel) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonCancel();\n\t\t\t}\n\t\t},\n\t\t[submit, onCancel]\n\t);\n\n\tconst submitDisabled = !url && !showRemove;\n\n\treturn (\n\t\t<div className=\"nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1\">\n\t\t\t<Input\n\t\t\t\tautoFocus\n\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\tplaceholder=\"Paste image URL...\"\n\t\t\t\ttype=\"url\"\n\t\t\t\tvalue={url}\n\t\t\t\tonChange={(e) => setUrl(e.target.value)}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t/>\n\t\t\t<Input\n\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\tplaceholder=\"Alt text (optional)\"\n\t\t\t\ttype=\"text\"\n\t\t\t\tvalue={alt}\n\t\t\t\tonChange={(e) => setAlt(e.target.value)}\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t/>\n\t\t\t<div className=\"nt:flex nt:items-center nt:justify-end nt:gap-1\">\n\t\t\t\t<Button\n\t\t\t\t\taria-label=\"Apply image\"\n\t\t\t\t\tdisabled={submitDisabled}\n\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tonClick={submit}\n\t\t\t\t>\n\t\t\t\t\t<CornerDownLeft />\n\t\t\t\t</Button>\n\t\t\t\t{showRemove && onRemove && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<Separator className=\"nt:h-5\" orientation=\"vertical\" />\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\taria-label=\"Remove image\"\n\t\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tonClick={onRemove}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Trash2 />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;AAEA,SAAS,gBAAgB,cAAc;AACvC,SAAS,aAAa,WAAW,gBAAgB;AAEjD,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,iBAAiB;AAuDvB,SA8BE,UA9BF,KA8BE,YA9BF;AA5CI,SAAS,eAAe;AAAA,EAC9B,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,UAAU;AACzC,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,UAAU;AAEzC,YAAU,MAAM;AACf,WAAO,UAAU;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,YAAU,MAAM;AACf,WAAO,UAAU;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,SAAS,YAAY,MAAM;AAChC,aAAS,EAAE,KAAK,IAAI,CAAC;AAAA,EACtB,GAAG,CAAC,KAAK,KAAK,QAAQ,CAAC;AAEvB,QAAM,gBAAgB;AAAA,IACrB,CAAC,UAAiD;AACjD,UAAI,MAAM,QAAQ,SAAS;AAC1B,cAAM,eAAe;AACrB,eAAO;AAEP;AAAA,MACD;AAEA,UAAI,MAAM,QAAQ,YAAY,UAAU;AACvC,cAAM,eAAe;AACrB,iBAAS;AAAA,MACV;AAAA,IACD;AAAA,IACA,CAAC,QAAQ,QAAQ;AAAA,EAClB;AAEA,QAAM,iBAAiB,CAAC,OAAO,CAAC;AAEhC,SACC,qBAAC,SAAI,WAAU,+CACd;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAS;AAAA,QACT,WAAU;AAAA,QACV,aAAY;AAAA,QACZ,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,QACtC,WAAW;AAAA;AAAA,IACZ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,aAAY;AAAA,QACZ,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,QACtC,WAAW;AAAA;AAAA,IACZ;AAAA,IACA,qBAAC,SAAI,WAAU,mDACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,cAAW;AAAA,UACX,UAAU;AAAA,UACV,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,SAAS;AAAA,UAET,8BAAC,kBAAe;AAAA;AAAA,MACjB;AAAA,MACC,cAAc,YACd,iCACC;AAAA,4BAAC,aAAU,WAAU,UAAS,aAAY,YAAW;AAAA,QACrD;AAAA,UAAC;AAAA;AAAA,YACA,cAAW;AAAA,YACX,MAAK;AAAA,YACL,UAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,SAAS;AAAA,YAET,8BAAC,UAAO;AAAA;AAAA,QACT;AAAA,SACD;AAAA,OAEF;AAAA,KACD;AAEF;","names":[]}

package/dist/components/image-popover/image-popover.cjs

@@ -17,55 +17,49 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/image-popover/image-popover.tsx
 var image_popover_exports = {};
 __export(image_popover_exports, {
   ImagePopover: () => ImagePopover
 });
 module.exports = __toCommonJS(image_popover_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
 var import_lucide_react = require("lucide-react");
 var import_react = require("react");
-var import_use_image_popover = require("./use-image-popover");
-var import_button = require("../ui/button");
-var import_input = require("../ui/input");
-var import_popover = require("../ui/popover");
-var import_separator = require("../ui/separator");
-const ImagePopover = (0, import_react.forwardRef)(
+var import_image_input_form = require("./image-input-form.cjs");
+var import_use_image_popover = require("./use-image-popover.cjs");
+var import_button = require("../ui/button.cjs");
+var import_popover = require("../ui/popover.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ImagePopover = (0, import_react.forwardRef)(
   ({ editor, ...buttonProps }, ref) => {
     const [isOpen, setIsOpen] = (0, import_react.useState)(false);
-    const {
-      url,
-      setUrl,
-      alt,
-      setAlt,
-      isActive,
-      canSet,
-      setImage,
-      removeImage,
-      wasSelectionMove
-    } = (0, import_use_image_popover.useImagePopover)({ editor });
+    const { url, alt, isActive, canSet, removeImage, wasSelectionMove } = (0, import_use_image_popover.useImagePopover)({ editor });
     (0, import_react.useEffect)(() => {
       if (isActive && wasSelectionMove) {
         setIsOpen(true);
       }
     }, [isActive, wasSelectionMove]);
-    const handleSetImage = (0, import_react.useCallback)(() => {
-      setImage();
-      setIsOpen(false);
-    }, [setImage]);
-    const handleRemoveImage = (0, import_react.useCallback)(() => {
-      removeImage();
-      setIsOpen(false);
-    }, [removeImage]);
-    const handleKeyDown = (0, import_react.useCallback)(
-      (event) => {
-        if (event.key === "Enter") {
-          event.preventDefault();
-          handleSetImage();
+    const handleSubmit = (0, import_react.useCallback)(
+      (values) => {
+        if (!editor) return;
+        if (!values.url) {
+          if (isActive) removeImage();
+          setIsOpen(false);
+          return;
         }
+        editor.chain().focus().setImage({
+          src: values.url,
+          alt: values.alt || void 0
+        }).run();
+        setIsOpen(false);
       },
-      [handleSetImage]
+      [editor, isActive, removeImage]
     );
+    const handleRemove = (0, import_react.useCallback)(() => {
+      removeImage();
+      setIsOpen(false);
+    }, [removeImage]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_popover.Popover, { open: isOpen, onOpenChange: setIsOpen, children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_button.Button,
@@ -88,68 +82,17 @@ const ImagePopover = (0, import_react.forwardRef)(
           )
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-        import_popover.PopoverContent,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverContent, { align: "start", className: "nt:w-auto nt:p-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_image_input_form.ImageInputForm,
         {
-          align: "start",
-          className: "nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_input.Input,
-              {
-                autoFocus: true,
-                className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
-                placeholder: "Paste image URL...",
-                type: "url",
-                value: url,
-                onChange: (e) => setUrl(e.target.value),
-                onKeyDown: handleKeyDown
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_input.Input,
-              {
-                className: "nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
-                placeholder: "Alt text (optional)",
-                type: "text",
-                value: alt,
-                onChange: (e) => setAlt(e.target.value),
-                onKeyDown: handleKeyDown
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "nt:flex nt:items-center nt:justify-end nt:gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                import_button.Button,
-                {
-                  "aria-label": "Apply image",
-                  disabled: !url && !isActive,
-                  size: "icon-sm",
-                  tabIndex: -1,
-                  type: "button",
-                  variant: "ghost",
-                  onClick: handleSetImage,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.CornerDownLeft, {})
-                }
-              ),
-              isActive && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator.Separator, { className: "nt:h-5", orientation: "vertical" }),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                  import_button.Button,
-                  {
-                    "aria-label": "Remove image",
-                    size: "icon-sm",
-                    tabIndex: -1,
-                    type: "button",
-                    variant: "ghost",
-                    onClick: handleRemoveImage,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Trash2, {})
-                  }
-                )
-              ] })
-            ] })
-          ]
+          initialAlt: alt,
+          initialUrl: url,
+          showRemove: isActive,
+          onCancel: () => setIsOpen(false),
+          onRemove: handleRemove,
+          onSubmit: handleSubmit
         }
-      )
+      ) })
     ] });
   }
 );

package/dist/components/image-popover/image-popover.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/image-popover/image-popover.tsx"],"sourcesContent":["'use client';\n\nimport { CornerDownLeft, ImageIcon, Trash2 } from 'lucide-react';\nimport { forwardRef, useCallback, useEffect, useState } from 'react';\n\nimport { useImagePopover } from './use-image-popover';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';\nimport { Separator } from '../ui/separator';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface ImagePopoverProps extends Omit<\n\tReact.ButtonHTMLAttributes<HTMLButtonElement>,\n\t'type'\n> {\n\teditor: Editor | null;\n}\n\nexport const ImagePopover = forwardRef<HTMLButtonElement, ImagePopoverProps>(\n\t({ editor, ...buttonProps }, ref) => {\n\t\tconst [isOpen, setIsOpen] = useState(false);\n\n\t\tconst {\n\t\t\turl,\n\t\t\tsetUrl,\n\t\t\talt,\n\t\t\tsetAlt,\n\t\t\tisActive,\n\t\t\tcanSet,\n\t\t\tsetImage,\n\t\t\tremoveImage,\n\t\t\twasSelectionMove\n\t\t} = useImagePopover({ editor });\n\n\t\t// Auto-open popover when cursor moves onto an existing image (selection-only transaction)\n\t\tuseEffect(() => {\n\t\t\tif (isActive && wasSelectionMove) {\n\t\t\t\tsetIsOpen(true);\n\t\t\t}\n\t\t}, [isActive, wasSelectionMove]);\n\n\t\tconst handleSetImage = useCallback(() => {\n\t\t\tsetImage();\n\t\t\tsetIsOpen(false);\n\t\t}, [setImage]);\n\n\t\tconst handleRemoveImage = useCallback(() => {\n\t\t\tremoveImage();\n\t\t\tsetIsOpen(false);\n\t\t}, [removeImage]);\n\n\t\tconst handleKeyDown = useCallback(\n\t\t\t(event: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleSetImage();\n\t\t\t\t}\n\t\t\t},\n\t\t\t[handleSetImage]\n\t\t);\n\n\t\treturn (\n\t\t\t<Popover open={isOpen} onOpenChange={setIsOpen}>\n\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\taria-label=\"Image\"\n\t\t\t\t\t\taria-pressed={isActive}\n\t\t\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\t\t\tdisabled={!canSet}\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t{...buttonProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ImageIcon\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tisActive ? 'nt:text-[var(--tt-brand-color-500)]' : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverTrigger>\n\t\t\t\t<PopoverContent\n\t\t\t\t\talign=\"start\"\n\t\t\t\t\tclassName=\"nt:flex nt:w-72 nt:flex-col nt:gap-1 nt:p-1\"\n\t\t\t\t>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\t\t\tplaceholder=\"Paste image URL...\"\n\t\t\t\t\t\ttype=\"url\"\n\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\tonChange={(e) => setUrl(e.target.value)}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t/>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tclassName=\"nt:h-7 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\t\t\tplaceholder=\"Alt text (optional)\"\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tvalue={alt}\n\t\t\t\t\t\tonChange={(e) => setAlt(e.target.value)}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"nt:flex nt:items-center nt:justify-end nt:gap-1\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\taria-label=\"Apply image\"\n\t\t\t\t\t\t\tdisabled={!url && !isActive}\n\t\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tonClick={handleSetImage}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<CornerDownLeft />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t{isActive && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<Separator className=\"nt:h-5\" orientation=\"vertical\" />\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\taria-label=\"Remove image\"\n\t\t\t\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\t\tonClick={handleRemoveImage}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Trash2 />\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</PopoverContent>\n\t\t\t</Popover>\n\t\t);\n\t}\n);\n\nImagePopover.displayName = 'ImagePopover';\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA8EM;AA5EN,0BAAkD;AAClD,mBAA6D;AAE7D,+BAAgC;AAChC,oBAAuB;AACvB,mBAAsB;AACtB,qBAAwD;AACxD,uBAA0B;AAWnB,MAAM,mBAAe;AAAA,EAC3B,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,QAAQ;AACpC,UAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD,QAAI,0CAAgB,EAAE,OAAO,CAAC;AAG9B,gCAAU,MAAM;AACf,UAAI,YAAY,kBAAkB;AACjC,kBAAU,IAAI;AAAA,MACf;AAAA,IACD,GAAG,CAAC,UAAU,gBAAgB,CAAC;AAE/B,UAAM,qBAAiB,0BAAY,MAAM;AACxC,eAAS;AACT,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,QAAQ,CAAC;AAEb,UAAM,wBAAoB,0BAAY,MAAM;AAC3C,kBAAY;AACZ,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,WAAW,CAAC;AAEhB,UAAM,oBAAgB;AAAA,MACrB,CAAC,UAAiD;AACjD,YAAI,MAAM,QAAQ,SAAS;AAC1B,gBAAM,eAAe;AACrB,yBAAe;AAAA,QAChB;AAAA,MACD;AAAA,MACA,CAAC,cAAc;AAAA,IAChB;AAEA,WACC,6CAAC,0BAAQ,MAAM,QAAQ,cAAc,WACpC;AAAA,kDAAC,iCAAe,SAAO,MACtB;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UACX,gBAAc;AAAA,UACd,qBAAmB,WAAW,OAAO;AAAA,UACrC,UAAU,CAAC;AAAA,UACX,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACP,GAAG;AAAA,UAEJ;AAAA,YAAC;AAAA;AAAA,cACA,WACC,WAAW,wCAAwC;AAAA;AAAA,UAErD;AAAA;AAAA,MACD,GACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAM;AAAA,UACN,WAAU;AAAA,UAEV;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAS;AAAA,gBACT,WAAU;AAAA,gBACV,aAAY;AAAA,gBACZ,MAAK;AAAA,gBACL,OAAO;AAAA,gBACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,gBACtC,WAAW;AAAA;AAAA,YACZ;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAU;AAAA,gBACV,aAAY;AAAA,gBACZ,MAAK;AAAA,gBACL,OAAO;AAAA,gBACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,gBACtC,WAAW;AAAA;AAAA,YACZ;AAAA,YACA,6CAAC,SAAI,WAAU,mDACd;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACA,cAAW;AAAA,kBACX,UAAU,CAAC,OAAO,CAAC;AAAA,kBACnB,MAAK;AAAA,kBACL,UAAU;AAAA,kBACV,MAAK;AAAA,kBACL,SAAQ;AAAA,kBACR,SAAS;AAAA,kBAET,sDAAC,sCAAe;AAAA;AAAA,cACjB;AAAA,cACC,YACA,4EACC;AAAA,4DAAC,8BAAU,WAAU,UAAS,aAAY,YAAW;AAAA,gBACrD;AAAA,kBAAC;AAAA;AAAA,oBACA,cAAW;AAAA,oBACX,MAAK;AAAA,oBACL,UAAU;AAAA,oBACV,MAAK;AAAA,oBACL,SAAQ;AAAA,oBACR,SAAS;AAAA,oBAET,sDAAC,8BAAO;AAAA;AAAA,gBACT;AAAA,iBACD;AAAA,eAEF;AAAA;AAAA;AAAA,MACD;AAAA,OACD;AAAA,EAEF;AACD;AAEA,aAAa,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/image-popover/image-popover.tsx"],"sourcesContent":["'use client';\n\nimport { ImageIcon } from 'lucide-react';\nimport { forwardRef, useCallback, useEffect, useState } from 'react';\n\nimport { ImageInputForm } from './image-input-form.js';\nimport { useImagePopover } from './use-image-popover.js';\nimport { Button } from '../ui/button.js';\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/popover.js';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface ImagePopoverProps extends Omit<\n\tReact.ButtonHTMLAttributes<HTMLButtonElement>,\n\t'type'\n> {\n\teditor: Editor | null;\n}\n\nexport const ImagePopover = forwardRef<HTMLButtonElement, ImagePopoverProps>(\n\t({ editor, ...buttonProps }, ref) => {\n\t\tconst [isOpen, setIsOpen] = useState(false);\n\n\t\tconst { url, alt, isActive, canSet, removeImage, wasSelectionMove } =\n\t\t\tuseImagePopover({ editor });\n\n\t\tuseEffect(() => {\n\t\t\tif (isActive && wasSelectionMove) {\n\t\t\t\tsetIsOpen(true);\n\t\t\t}\n\t\t}, [isActive, wasSelectionMove]);\n\n\t\t// Bypass useImagePopover.setImage — it reads url/alt from hook state,\n\t\t// which lags behind the form values when called synchronously after the\n\t\t// hook's setUrl/setAlt setters. Submit values directly to the editor.\n\t\tconst handleSubmit = useCallback(\n\t\t\t(values: { url: string; alt: string }) => {\n\t\t\t\tif (!editor) return;\n\n\t\t\t\tif (!values.url) {\n\t\t\t\t\tif (isActive) removeImage();\n\n\t\t\t\t\tsetIsOpen(false);\n\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.setImage({\n\t\t\t\t\t\tsrc: values.url,\n\t\t\t\t\t\talt: values.alt || undefined\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tsetIsOpen(false);\n\t\t\t},\n\t\t\t[editor, isActive, removeImage]\n\t\t);\n\n\t\tconst handleRemove = useCallback(() => {\n\t\t\tremoveImage();\n\t\t\tsetIsOpen(false);\n\t\t}, [removeImage]);\n\n\t\treturn (\n\t\t\t<Popover open={isOpen} onOpenChange={setIsOpen}>\n\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\taria-label=\"Image\"\n\t\t\t\t\t\taria-pressed={isActive}\n\t\t\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\t\t\tdisabled={!canSet}\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t{...buttonProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ImageIcon\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tisActive ? 'nt:text-[var(--tt-brand-color-500)]' : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverTrigger>\n\t\t\t\t<PopoverContent align=\"start\" className=\"nt:w-auto nt:p-0\">\n\t\t\t\t\t<ImageInputForm\n\t\t\t\t\t\tinitialAlt={alt}\n\t\t\t\t\t\tinitialUrl={url}\n\t\t\t\t\t\tshowRemove={isActive}\n\t\t\t\t\t\tonCancel={() => setIsOpen(false)}\n\t\t\t\t\t\tonRemove={handleRemove}\n\t\t\t\t\t\tonSubmit={handleSubmit}\n\t\t\t\t\t/>\n\t\t\t\t</PopoverContent>\n\t\t\t</Popover>\n\t\t);\n\t}\n);\n\nImagePopover.displayName = 'ImagePopover';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,0BAA0B;AAC1B,mBAA6D;AAE7D,8BAA+B;AAC/B,+BAAgC;AAChC,oBAAuB;AACvB,qBAAwD;AA0DrD;AA/CI,IAAM,mBAAe;AAAA,EAC3B,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,QAAQ;AACpC,UAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,UAAM,EAAE,KAAK,KAAK,UAAU,QAAQ,aAAa,iBAAiB,QACjE,0CAAgB,EAAE,OAAO,CAAC;AAE3B,gCAAU,MAAM;AACf,UAAI,YAAY,kBAAkB;AACjC,kBAAU,IAAI;AAAA,MACf;AAAA,IACD,GAAG,CAAC,UAAU,gBAAgB,CAAC;AAK/B,UAAM,mBAAe;AAAA,MACpB,CAAC,WAAyC;AACzC,YAAI,CAAC,OAAQ;AAEb,YAAI,CAAC,OAAO,KAAK;AAChB,cAAI,SAAU,aAAY;AAE1B,oBAAU,KAAK;AAEf;AAAA,QACD;AAEA,eACE,MAAM,EACN,MAAM,EACN,SAAS;AAAA,UACT,KAAK,OAAO;AAAA,UACZ,KAAK,OAAO,OAAO;AAAA,QACpB,CAAC,EACA,IAAI;AACN,kBAAU,KAAK;AAAA,MAChB;AAAA,MACA,CAAC,QAAQ,UAAU,WAAW;AAAA,IAC/B;AAEA,UAAM,mBAAe,0BAAY,MAAM;AACtC,kBAAY;AACZ,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,WAAW,CAAC;AAEhB,WACC,6CAAC,0BAAQ,MAAM,QAAQ,cAAc,WACpC;AAAA,kDAAC,iCAAe,SAAO,MACtB;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UACX,gBAAc;AAAA,UACd,qBAAmB,WAAW,OAAO;AAAA,UACrC,UAAU,CAAC;AAAA,UACX,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACP,GAAG;AAAA,UAEJ;AAAA,YAAC;AAAA;AAAA,cACA,WACC,WAAW,wCAAwC;AAAA;AAAA,UAErD;AAAA;AAAA,MACD,GACD;AAAA,MACA,4CAAC,iCAAe,OAAM,SAAQ,WAAU,oBACvC;AAAA,QAAC;AAAA;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,UAAU,MAAM,UAAU,KAAK;AAAA,UAC/B,UAAU;AAAA,UACV,UAAU;AAAA;AAAA,MACX,GACD;AAAA,OACD;AAAA,EAEF;AACD;AAEA,aAAa,cAAc;","names":[]}