@junbyeol/tiptap-editor 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +73 -0
- package/dist/index.cjs +215 -0
- package/dist/index.mjs +28278 -0
- package/dist/style.css +1 -0
- package/dist/types/components/custom/color-text-popover.d.ts +11 -0
- package/dist/types/components/custom/table-cell-background-color-popover.d.ts +11 -0
- package/dist/types/components/custom/variables.d.ts +41 -0
- package/dist/types/components/tiptap-icons/align-center-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/align-justify-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/align-left-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/align-right-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/bold-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/chevron-down-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/code2-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-five-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-four-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-one-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-six-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-three-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/heading-two-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/italic-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/list-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/list-ordered-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/list-todo-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/redo2-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/strike-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/subscript-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/superscript-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/underline-icon.d.ts +3 -0
- package/dist/types/components/tiptap-icons/undo2-icon.d.ts +3 -0
- package/dist/types/components/tiptap-ui/heading-button/heading-button.d.ts +23 -0
- package/dist/types/components/tiptap-ui/heading-button/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/heading-button/use-heading.d.ts +108 -0
- package/dist/types/components/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.d.ts +20 -0
- package/dist/types/components/tiptap-ui/heading-dropdown-menu/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/heading-dropdown-menu/use-heading-dropdown-menu.d.ts +73 -0
- package/dist/types/components/tiptap-ui/list-button/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/list-button/list-button.d.ts +23 -0
- package/dist/types/components/tiptap-ui/list-button/use-list.d.ts +97 -0
- package/dist/types/components/tiptap-ui/mark-button/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/mark-button/mark-button.d.ts +23 -0
- package/dist/types/components/tiptap-ui/mark-button/use-mark.d.ts +104 -0
- package/dist/types/components/tiptap-ui/text-align-button/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/text-align-button/text-align-button.d.ts +30 -0
- package/dist/types/components/tiptap-ui/text-align-button/use-text-align.d.ts +101 -0
- package/dist/types/components/tiptap-ui/undo-redo-button/index.d.ts +2 -0
- package/dist/types/components/tiptap-ui/undo-redo-button/undo-redo-button.d.ts +23 -0
- package/dist/types/components/tiptap-ui/undo-redo-button/use-undo-redo.d.ts +90 -0
- package/dist/types/components/tiptap-ui-primitive/badge/badge.d.ts +8 -0
- package/dist/types/components/tiptap-ui-primitive/badge/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/button/button.d.ts +17 -0
- package/dist/types/components/tiptap-ui-primitive/button/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/card/card.d.ts +9 -0
- package/dist/types/components/tiptap-ui-primitive/card/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/dropdown-menu/dropdown-menu.d.ts +16 -0
- package/dist/types/components/tiptap-ui-primitive/dropdown-menu/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/label/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/label/label.d.ts +11 -0
- package/dist/types/components/tiptap-ui-primitive/popover/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/popover/popover.d.ts +5 -0
- package/dist/types/components/tiptap-ui-primitive/separator/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/separator/separator.d.ts +6 -0
- package/dist/types/components/tiptap-ui-primitive/spacer/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/spacer/spacer.d.ts +6 -0
- package/dist/types/components/tiptap-ui-primitive/toolbar/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/toolbar/toolbar.d.ts +8 -0
- package/dist/types/components/tiptap-ui-primitive/tooltip/index.d.ts +1 -0
- package/dist/types/components/tiptap-ui-primitive/tooltip/tooltip.d.ts +28 -0
- package/dist/types/hooks/use-composed-ref.d.ts +3 -0
- package/dist/types/hooks/use-is-breakpoint.d.ts +9 -0
- package/dist/types/hooks/use-menu-navigation.d.ts +52 -0
- package/dist/types/hooks/use-tiptap-editor.d.ts +17 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/lib/index.d.ts +5 -0
- package/dist/types/lib/tiptap-utils.d.ts +168 -0
- package/dist/types/tiptap/extensions/default-file-attachment.d.ts +2 -0
- package/dist/types/tiptap/extensions/file-attachment.d.ts +13 -0
- package/dist/types/tiptap/index.d.ts +29 -0
- package/dist/types/tiptap/menubar.d.ts +4 -0
- package/dist/vite.svg +1 -0
- package/package.json +86 -0
package/dist/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{overflow-wrap:break-word;text-size-adjust:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--tt-gray-light-a-50: rgba(56, 56, 56, .04);--tt-gray-light-a-100: rgba(15, 22, 36, .05);--tt-gray-light-a-200: rgba(37, 39, 45, .1);--tt-gray-light-a-300: rgba(47, 50, 55, .2);--tt-gray-light-a-400: rgba(40, 44, 51, .42);--tt-gray-light-a-500: rgba(52, 55, 60, .64);--tt-gray-light-a-600: rgba(36, 39, 46, .78);--tt-gray-light-a-700: rgba(35, 37, 42, .87);--tt-gray-light-a-800: rgba(30, 32, 36, .95);--tt-gray-light-a-900: rgba(29, 30, 32, .98);--tt-gray-light-50: rgba(250, 250, 250, 1);--tt-gray-light-100: rgba(244, 244, 245, 1);--tt-gray-light-200: rgba(234, 234, 235, 1);--tt-gray-light-300: rgba(213, 214, 215, 1);--tt-gray-light-400: rgba(166, 167, 171, 1);--tt-gray-light-500: rgba(125, 127, 130, 1);--tt-gray-light-600: rgba(83, 86, 90, 1);--tt-gray-light-700: rgba(64, 65, 69, 1);--tt-gray-light-800: rgba(44, 45, 48, 1);--tt-gray-light-900: rgba(34, 35, 37, 1);--tt-gray-dark-a-50: rgba(232, 232, 253, .05);--tt-gray-dark-a-100: rgba(231, 231, 243, .07);--tt-gray-dark-a-200: rgba(238, 238, 246, .11);--tt-gray-dark-a-300: rgba(239, 239, 245, .22);--tt-gray-dark-a-400: rgba(244, 244, 255, .37);--tt-gray-dark-a-500: rgba(236, 238, 253, .5);--tt-gray-dark-a-600: rgba(247, 247, 253, .64);--tt-gray-dark-a-700: rgba(251, 251, 254, .75);--tt-gray-dark-a-800: rgba(253, 253, 253, .88);--tt-gray-dark-a-900: rgba(255, 255, 255, .96);--tt-gray-dark-50: rgba(25, 25, 26, 1);--tt-gray-dark-100: rgba(32, 32, 34, 1);--tt-gray-dark-200: rgba(45, 45, 47, 1);--tt-gray-dark-300: rgba(70, 70, 73, 1);--tt-gray-dark-400: rgba(99, 99, 105, 1);--tt-gray-dark-500: rgba(124, 124, 131, 1);--tt-gray-dark-600: rgba(163, 163, 168, 1);--tt-gray-dark-700: rgba(192, 192, 195, 1);--tt-gray-dark-800: rgba(224, 224, 225, 1);--tt-gray-dark-900: rgba(245, 245, 245, 1);--tt-brand-color-50: rgba(239, 238, 255, 1);--tt-brand-color-100: rgba(222, 219, 255, 1);--tt-brand-color-200: rgba(195, 189, 255, 1);--tt-brand-color-300: rgba(157, 138, 255, 1);--tt-brand-color-400: rgba(122, 82, 255, 1);--tt-brand-color-500: rgba(98, 41, 255, 1);--tt-brand-color-600: rgba(84, 0, 229, 1);--tt-brand-color-700: rgba(75, 0, 204, 1);--tt-brand-color-800: rgba(56, 0, 153, 1);--tt-brand-color-900: rgba(43, 25, 102, 1);--tt-brand-color-950: hsla(257, 100%, 9%, 1);--tt-color-green-inc-5: hsla(129, 100%, 97%, 1);--tt-color-green-inc-4: hsla(129, 100%, 92%, 1);--tt-color-green-inc-3: hsla(131, 100%, 86%, 1);--tt-color-green-inc-2: hsla(133, 98%, 78%, 1);--tt-color-green-inc-1: hsla(137, 99%, 70%, 1);--tt-color-green-base: hsla(147, 99%, 50%, 1);--tt-color-green-dec-1: hsla(147, 97%, 41%, 1);--tt-color-green-dec-2: hsla(146, 98%, 32%, 1);--tt-color-green-dec-3: hsla(146, 100%, 24%, 1);--tt-color-green-dec-4: hsla(144, 100%, 16%, 1);--tt-color-green-dec-5: hsla(140, 100%, 9%, 1);--tt-color-yellow-inc-5: hsla(50, 100%, 97%, 1);--tt-color-yellow-inc-4: hsla(50, 100%, 91%, 1);--tt-color-yellow-inc-3: hsla(50, 100%, 84%, 1);--tt-color-yellow-inc-2: hsla(50, 100%, 77%, 1);--tt-color-yellow-inc-1: hsla(50, 100%, 68%, 1);--tt-color-yellow-base: hsla(52, 100%, 50%, 1);--tt-color-yellow-dec-1: hsla(52, 100%, 41%, 1);--tt-color-yellow-dec-2: hsla(52, 100%, 32%, 1);--tt-color-yellow-dec-3: hsla(52, 100%, 24%, 1);--tt-color-yellow-dec-4: hsla(51, 100%, 16%, 1);--tt-color-yellow-dec-5: hsla(50, 100%, 9%, 1);--tt-color-red-inc-5: hsla(11, 100%, 96%, 1);--tt-color-red-inc-4: hsla(11, 100%, 88%, 1);--tt-color-red-inc-3: hsla(10, 100%, 80%, 1);--tt-color-red-inc-2: hsla(9, 100%, 73%, 1);--tt-color-red-inc-1: hsla(7, 100%, 64%, 1);--tt-color-red-base: hsla(7, 100%, 54%, 1);--tt-color-red-dec-1: hsla(7, 100%, 41%, 1);--tt-color-red-dec-2: hsla(5, 100%, 32%, 1);--tt-color-red-dec-3: hsla(4, 100%, 24%, 1);--tt-color-red-dec-4: hsla(3, 100%, 16%, 1);--tt-color-red-dec-5: hsla(1, 100%, 9%, 1);--white: rgba(255, 255, 255, 1);--black: rgba(14, 14, 17, 1);--transparent: rgba(255, 255, 255, 0);--tt-shadow-elevated-md: 0px 16px 48px 0px rgba(17, 24, 39, .04), 0px 12px 24px 0px rgba(17, 24, 39, .04), 0px 6px 8px 0px rgba(17, 24, 39, .02), 0px 2px 3px 0px rgba(17, 24, 39, .02);--tt-radius-xxs: .125rem;--tt-radius-xs: .25rem;--tt-radius-sm: .375rem;--tt-radius-md: .5rem;--tt-radius-lg: .75rem;--tt-radius-xl: 1rem;--tt-transition-duration-short: .1s;--tt-transition-duration-default: .2s;--tt-transition-duration-long: .64s;--tt-transition-easing-default: cubic-bezier(.46, .03, .52, .96);--tt-transition-easing-cubic: cubic-bezier(.65, .05, .36, 1);--tt-transition-easing-quart: cubic-bezier(.77, 0, .18, 1);--tt-transition-easing-circ: cubic-bezier(.79, .14, .15, .86);--tt-transition-easing-back: cubic-bezier(.68, -.55, .27, 1.55);--tt-accent-contrast: 8%;--tt-destructive-contrast: 8%;--tt-foreground-contrast: 8%}:root,:root *,:root :before,:root :after{box-sizing:border-box;transition:none var(--tt-transition-duration-default) var(--tt-transition-easing-default)}:root{--tt-bg-color: var(--white);--tt-border-color: var(--tt-gray-light-a-200);--tt-border-color-tint: var(--tt-gray-light-a-100);--tt-sidebar-bg-color: var(--tt-gray-light-100);--tt-scrollbar-color: var(--tt-gray-light-a-200);--tt-cursor-color: var(--tt-brand-color-500);--tt-selection-color: rgba(157, 138, 255, .2);--tt-card-bg-color: var(--white);--tt-card-border-color: var(--tt-gray-light-a-100)}.dark{--tt-bg-color: var(--black);--tt-border-color: var(--tt-gray-dark-a-200);--tt-border-color-tint: var(--tt-gray-dark-a-100);--tt-sidebar-bg-color: var(--tt-gray-dark-100);--tt-scrollbar-color: var(--tt-gray-dark-a-200);--tt-cursor-color: var(--tt-brand-color-400);--tt-selection-color: rgba(122, 82, 255, .2);--tt-card-bg-color: var(--tt-gray-dark-50);--tt-card-border-color: var(--tt-gray-dark-a-50);--tt-shadow-elevated-md: 0px 16px 48px 0px rgba(0, 0, 0, .5), 0px 12px 24px 0px rgba(0, 0, 0, .24), 0px 6px 8px 0px rgba(0, 0, 0, .22), 0px 2px 3px 0px rgba(0, 0, 0, .12)}:root{--tt-color-text-gray: hsl(45, 2%, 46%);--tt-color-text-brown: hsl(19, 31%, 47%);--tt-color-text-orange: hsl(30, 89%, 45%);--tt-color-text-yellow: hsl(38, 62%, 49%);--tt-color-text-green: hsl(148, 32%, 39%);--tt-color-text-blue: hsl(202, 54%, 43%);--tt-color-text-purple: hsl(274, 32%, 54%);--tt-color-text-pink: hsl(328, 49%, 53%);--tt-color-text-red: hsl(2, 62%, 55%);--tt-color-text-gray-contrast: hsla(39, 26%, 26%, .15);--tt-color-text-brown-contrast: hsla(18, 43%, 69%, .35);--tt-color-text-orange-contrast: hsla(24, 73%, 55%, .27);--tt-color-text-yellow-contrast: hsla(44, 82%, 59%, .39);--tt-color-text-green-contrast: hsla(126, 29%, 60%, .27);--tt-color-text-blue-contrast: hsla(202, 54%, 59%, .27);--tt-color-text-purple-contrast: hsla(274, 37%, 64%, .27);--tt-color-text-pink-contrast: hsla(331, 60%, 71%, .27);--tt-color-text-red-contrast: hsla(8, 79%, 79%, .4)}.dark{--tt-color-text-gray: hsl(0, 0%, 61%);--tt-color-text-brown: hsl(18, 35%, 58%);--tt-color-text-orange: hsl(25, 53%, 53%);--tt-color-text-yellow: hsl(36, 54%, 55%);--tt-color-text-green: hsl(145, 32%, 47%);--tt-color-text-blue: hsl(202, 64%, 52%);--tt-color-text-purple: hsl(270, 55%, 62%);--tt-color-text-pink: hsl(329, 57%, 58%);--tt-color-text-red: hsl(1, 69%, 60%);--tt-color-text-gray-contrast: hsla(0, 0%, 100%, .09);--tt-color-text-brown-contrast: hsla(17, 45%, 50%, .25);--tt-color-text-orange-contrast: hsla(27, 82%, 53%, .2);--tt-color-text-yellow-contrast: hsla(35, 49%, 47%, .2);--tt-color-text-green-contrast: hsla(151, 55%, 39%, .2);--tt-color-text-blue-contrast: hsla(202, 54%, 43%, .2);--tt-color-text-purple-contrast: hsla(271, 56%, 60%, .18);--tt-color-text-pink-contrast: hsla(331, 67%, 58%, .22);--tt-color-text-red-contrast: hsla(0, 67%, 60%, .25)}:root{--tt-color-highlight-yellow: #fef9c3;--tt-color-highlight-green: #dcfce7;--tt-color-highlight-blue: #e0f2fe;--tt-color-highlight-purple: #f3e8ff;--tt-color-highlight-red: #ffe4e6;--tt-color-highlight-gray: rgb(248, 248, 247);--tt-color-highlight-brown: rgb(244, 238, 238);--tt-color-highlight-orange: rgb(251, 236, 221);--tt-color-highlight-pink: rgb(252, 241, 246);--tt-color-highlight-yellow-contrast: #fbe604;--tt-color-highlight-green-contrast: #c7fad8;--tt-color-highlight-blue-contrast: #ceeafd;--tt-color-highlight-purple-contrast: #e4ccff;--tt-color-highlight-red-contrast: #ffccd0;--tt-color-highlight-gray-contrast: rgba(84, 72, 49, .15);--tt-color-highlight-brown-contrast: rgba(210, 162, 141, .35);--tt-color-highlight-orange-contrast: rgba(224, 124, 57, .27);--tt-color-highlight-pink-contrast: rgba(225, 136, 179, .27)}.dark{--tt-color-highlight-yellow: #6b6524;--tt-color-highlight-green: #509568;--tt-color-highlight-blue: #6e92aa;--tt-color-highlight-purple: #583e74;--tt-color-highlight-red: #743e42;--tt-color-highlight-gray: rgb(47, 47, 47);--tt-color-highlight-brown: rgb(74, 50, 40);--tt-color-highlight-orange: rgb(92, 59, 35);--tt-color-highlight-pink: rgb(78, 44, 60);--tt-color-highlight-yellow-contrast: #58531e;--tt-color-highlight-green-contrast: #47855d;--tt-color-highlight-blue-contrast: #5e86a1;--tt-color-highlight-purple-contrast: #4c3564;--tt-color-highlight-red-contrast: #643539;--tt-color-highlight-gray-contrast: rgba(255, 255, 255, .094);--tt-color-highlight-brown-contrast: rgba(184, 101, 69, .25);--tt-color-highlight-orange-contrast: rgba(233, 126, 37, .2);--tt-color-highlight-pink-contrast: rgba(220, 76, 145, .22)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes zoomIn{0%{transform:scale(.95)}to{transform:scale(1)}}@keyframes zoomOut{0%{transform:scale(1)}to{transform:scale(.95)}}@keyframes zoom{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideFromTop{0%{transform:translateY(-.5rem)}to{transform:translateY(0)}}@keyframes slideFromRight{0%{transform:translate(.5rem)}to{transform:translate(0)}}@keyframes slideFromLeft{0%{transform:translate(-.5rem)}to{transform:translate(0)}}@keyframes slideFromBottom{0%{transform:translateY(.5rem)}to{transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tiptap{--gray-1: var(--tt-gray-light-50);--gray-2: var(--tt-gray-light-a-200);--gray-3: var(--tt-gray-light-a-300);--purple: var(--tt-brand-color-500);--purple-light: var(--tt-brand-color-100)}.tiptap :first-child{margin-top:0}.tiptap ul,.tiptap ol{padding:0 1rem;margin:1.25rem 1rem 1.25rem .4rem}:is(.tiptap ul,.tiptap ol) li p{margin-top:.25em;margin-bottom:.25em}.tiptap h1,.tiptap h2,.tiptap h3,.tiptap h4,.tiptap h5,.tiptap h6{line-height:1.1;margin-top:2.5rem;text-wrap:pretty}.tiptap h1,.tiptap h2{margin-top:3.5rem;margin-bottom:1.5rem}.tiptap h1{font-size:1.4rem}.tiptap h2{font-size:1.2rem}.tiptap h3{font-size:1.1rem}.tiptap h4,.tiptap h5,.tiptap h6{font-size:1rem}.tiptap code{background-color:var(--purple-light);border-radius:.4rem;color:var(--black);font-size:.85rem;padding:.25em .3em}.tiptap pre{background:var(--black);border-radius:.5rem;color:var(--white);font-family:JetBrainsMono,monospace;margin:1.5rem 0;padding:.75rem 1rem}.tiptap pre code{background:none;color:inherit;font-size:.8rem;padding:0}.tiptap blockquote{border-left:3px solid var(--gray-3);margin:1.5rem 0;padding-left:1rem}.tiptap hr{border:none;border-top:1px solid var(--gray-2);margin:2rem 0}.tiptap table{border-collapse:collapse;margin:0;overflow:hidden;table-layout:fixed;width:100%}.tiptap table td,.tiptap table th{border:1px solid var(--gray-3);box-sizing:border-box;min-width:1em;padding:6px 8px;position:relative;vertical-align:top}:is(.tiptap table td,.tiptap table th)>*{margin-bottom:0}.tiptap table th{background-color:var(--gray-1);font-weight:700;text-align:left}.tiptap .tableWrapper{margin:1.5rem 0;overflow-x:auto}.tiptap.resize-cursor{cursor:ew-resize;cursor:col-resize}.tiptap .file-attachment{display:inline-flex;align-items:center;gap:.75rem;background-color:var(--black);border-radius:9999px;padding:.75rem 1.25rem;text-decoration:none;cursor:pointer}.tiptap .file-attachment__icon{flex-shrink:0;color:var(--white)}.tiptap .file-attachment__name{font-size:1rem;font-weight:700;color:var(--white)}.tiptap-wrapper{width:100%;height:100%;border:1px solid #ccc;border-radius:10px;padding:10px}.tiptap table .selectedCell:after{background:var(--gray-2);content:"";inset:0;pointer-events:none;position:absolute;z-index:2}.tiptap table .column-resize-handle{background-color:var(--purple);bottom:-2px;pointer-events:none;position:absolute;right:-2px;top:0;width:4px}.tiptap-separator{--tt-link-border-color: var(--tt-gray-light-a-200)}.dark .tiptap-separator{--tt-link-border-color: var(--tt-gray-dark-a-200)}.tiptap-separator{flex-shrink:0;background-color:var(--tt-link-border-color)}.tiptap-separator[data-orientation=horizontal]{height:1px;width:100%;margin:.5rem 0}.tiptap-separator[data-orientation=vertical]{height:1.5rem;width:1px}:root{--tt-toolbar-height: 2.75rem;--tt-safe-area-bottom: env(safe-area-inset-bottom, 0px);--tt-toolbar-bg-color: var(--white);--tt-toolbar-border-color: var(--tt-gray-light-a-100)}.dark{--tt-toolbar-bg-color: var(--black);--tt-toolbar-border-color: var(--tt-gray-dark-a-50)}.tiptap-toolbar{display:flex;align-items:center;gap:.25rem}.tiptap-toolbar-group{display:flex;align-items:center;gap:.125rem}.tiptap-toolbar-group:empty{display:none}.tiptap-toolbar-group:empty+.tiptap-separator,.tiptap-separator+.tiptap-toolbar-group:empty{display:none}.tiptap-toolbar[data-variant=fixed]{position:sticky;top:0;z-index:10;width:100%;min-height:var(--tt-toolbar-height);background:var(--tt-toolbar-bg-color);border-bottom:1px solid var(--tt-toolbar-border-color);padding:0 .5rem;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.tiptap-toolbar[data-variant=fixed]::-webkit-scrollbar{display:none}@media(max-width:480px){.tiptap-toolbar[data-variant=fixed]{position:absolute;top:auto;height:calc(var(--tt-toolbar-height) + var(--tt-safe-area-bottom));border-top:1px solid var(--tt-toolbar-border-color);border-bottom:none;padding:0 .5rem var(--tt-safe-area-bottom);flex-wrap:nowrap;justify-content:flex-start}.tiptap-toolbar[data-variant=fixed] .tiptap-toolbar-group{flex:0 0 auto}}.tiptap-toolbar[data-variant=floating]{--tt-toolbar-padding: .125rem;--tt-toolbar-border-width: 1px;padding:.188rem;border-radius:calc(var(--tt-toolbar-padding) + var(--tt-radius-lg) + var(--tt-toolbar-border-width));border:var(--tt-toolbar-border-width) solid var(--tt-toolbar-border-color);background-color:var(--tt-toolbar-bg-color);box-shadow:var(--tt-shadow-elevated-md);outline:none;overflow:hidden}.tiptap-toolbar[data-variant=floating][data-plain=true]{padding:0;border-radius:0;border:none;box-shadow:none;background-color:transparent}@media screen and (max-width:480px){.tiptap-toolbar[data-variant=floating]{width:100%;border-radius:0;border:none;box-shadow:none}}.my-toolbar{display:flex;flex-direction:column;flex-wrap:wrap;gap:4px}.tiptap-tooltip{--tt-tooltip-bg: var(--tt-gray-light-900);--tt-tooltip-text: var(--white);--tt-kbd: var(--tt-gray-dark-a-400)}.dark .tiptap-tooltip{--tt-tooltip-bg: var(--white);--tt-tooltip-text: var(--tt-gray-light-600);--tt-kbd: var(--tt-gray-light-a-400)}.tiptap-tooltip{z-index:50;overflow:hidden;border-radius:var(--tt-radius-md, .375rem);background-color:var(--tt-tooltip-bg);padding:.375rem .5rem;font-size:.75rem;font-weight:500;color:var(--tt-tooltip-text);box-shadow:0 4px 6px -1px #0000001a;text-align:center}.tiptap-tooltip kbd{display:inline-block;text-align:center;vertical-align:baseline;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;text-transform:capitalize;color:var(--tt-kbd)}.tiptap-button{--tt-button-default-bg-color: var(--tt-gray-light-a-100);--tt-button-hover-bg-color: var(--tt-gray-light-200);--tt-button-active-bg-color: var(--tt-gray-light-a-200);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-100 );--tt-button-active-bg-color-subdued: var( --tt-gray-light-a-200 );--tt-button-active-hover-bg-color: var(--tt-gray-light-300);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-200 );--tt-button-active-hover-bg-color-subdued: var( --tt-gray-light-a-300 );--tt-button-disabled-bg-color: var(--tt-gray-light-a-50)}.dark .tiptap-button{--tt-button-default-bg-color: var(--tt-gray-dark-a-100);--tt-button-hover-bg-color: var(--tt-gray-dark-200);--tt-button-active-bg-color: var(--tt-gray-dark-a-200);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-900 );--tt-button-active-bg-color-subdued: var( --tt-gray-dark-a-200 );--tt-button-active-hover-bg-color: var(--tt-gray-dark-300);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-800 );--tt-button-active-hover-bg-color-subdued: var( --tt-gray-dark-a-300 );--tt-button-disabled-bg-color: var(--tt-gray-dark-a-50)}.tiptap-button{--tt-button-default-text-color: var(--tt-gray-light-a-600);--tt-button-hover-text-color: var(--tt-gray-light-a-900);--tt-button-active-text-color: var(--tt-gray-light-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-light-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-light-a-900);--tt-button-disabled-text-color: var(--tt-gray-light-a-400)}.dark .tiptap-button{--tt-button-default-text-color: var(--tt-gray-dark-a-600);--tt-button-hover-text-color: var(--tt-gray-dark-a-900);--tt-button-active-text-color: var(--tt-gray-dark-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-dark-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-dark-a-900);--tt-button-disabled-text-color: var(--tt-gray-dark-a-300)}.tiptap-button{--tt-button-default-icon-color: var(--tt-gray-light-a-600);--tt-button-hover-icon-color: var(--tt-gray-light-a-900);--tt-button-active-icon-color: var(--tt-brand-color-500);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-600);--tt-button-active-icon-color-subdued: var(--tt-gray-light-a-900);--tt-button-disabled-icon-color: var(--tt-gray-light-a-400)}.dark .tiptap-button{--tt-button-default-icon-color: var(--tt-gray-dark-a-600);--tt-button-hover-icon-color: var(--tt-gray-dark-a-900);--tt-button-active-icon-color: var(--tt-brand-color-400);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-400);--tt-button-active-icon-color-subdued: var(--tt-gray-dark-a-900);--tt-button-disabled-icon-color: var(--tt-gray-dark-a-400)}.tiptap-button{--tt-button-default-icon-sub-color: var(--tt-gray-light-a-400);--tt-button-hover-icon-sub-color: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color: var(--tt-gray-light-a-400);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-light-a-400);--tt-button-disabled-icon-sub-color: var(--tt-gray-light-a-100)}.dark .tiptap-button{--tt-button-default-icon-sub-color: var(--tt-gray-dark-a-300);--tt-button-hover-icon-sub-color: var(--tt-gray-dark-a-400);--tt-button-active-icon-sub-color: var(--tt-gray-dark-a-300);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-dark-a-400);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-dark-a-300);--tt-button-disabled-icon-sub-color: var(--tt-gray-dark-a-100)}.tiptap-button{--tt-button-default-dropdown-arrows-color: var(--tt-gray-light-a-600);--tt-button-hover-dropdown-arrows-color: var(--tt-gray-light-a-700);--tt-button-active-dropdown-arrows-color: var(--tt-gray-light-a-600);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-light-a-700 );--tt-button-active-dropdown-arrows-color-subdued: var(--tt-gray-light-a-600);--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-light-a-400)}.dark .tiptap-button{--tt-button-default-dropdown-arrows-color: var(--tt-gray-dark-a-600);--tt-button-hover-dropdown-arrows-color: var(--tt-gray-dark-a-700);--tt-button-active-dropdown-arrows-color: var(--tt-gray-dark-a-600);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-dark-a-700 );--tt-button-active-dropdown-arrows-color-subdued: var(--tt-gray-dark-a-600);--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-dark-a-400)}.tiptap-button[data-style=ghost]{--tt-button-default-bg-color: var(--transparent);--tt-button-hover-bg-color: var(--tt-gray-light-200);--tt-button-active-bg-color: var(--tt-gray-light-a-100);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-100 );--tt-button-active-bg-color-subdued: var( --tt-gray-light-a-100 );--tt-button-active-hover-bg-color: var(--tt-gray-light-200);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-200 );--tt-button-active-hover-bg-color-subdued: var( --tt-gray-light-a-200 );--tt-button-disabled-bg-color: var(--transparent)}.dark .tiptap-button[data-style=ghost]{--tt-button-default-bg-color: var(--transparent);--tt-button-hover-bg-color: var(--tt-gray-dark-200);--tt-button-active-bg-color: var(--tt-gray-dark-a-100);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-900 );--tt-button-active-bg-color-subdued: var( --tt-gray-dark-a-100 );--tt-button-active-hover-bg-color: var(--tt-gray-dark-200);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-800 );--tt-button-active-hover-bg-color-subdued: var( --tt-gray-dark-a-200 );--tt-button-disabled-bg-color: var(--transparent)}.tiptap-button[data-style=ghost]{--tt-button-default-text-color: var(--tt-gray-light-a-600);--tt-button-hover-text-color: var(--tt-gray-light-a-900);--tt-button-active-text-color: var(--tt-gray-light-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-light-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-light-a-900);--tt-button-disabled-text-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=ghost]{--tt-button-default-text-color: var(--tt-gray-dark-a-600);--tt-button-hover-text-color: var(--tt-gray-dark-a-900);--tt-button-active-text-color: var(--tt-gray-dark-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-dark-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-dark-a-900);--tt-button-disabled-text-color: var(--tt-gray-dark-a-300)}.tiptap-button[data-style=ghost]{--tt-button-default-icon-color: var(--tt-gray-light-a-600);--tt-button-hover-icon-color: var(--tt-gray-light-a-900);--tt-button-active-icon-color: var(--tt-brand-color-500);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-600);--tt-button-active-icon-color-subdued: var(--tt-gray-light-a-900);--tt-button-disabled-icon-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=ghost]{--tt-button-default-icon-color: var(--tt-gray-dark-a-600);--tt-button-hover-icon-color: var(--tt-gray-dark-a-900);--tt-button-active-icon-color: var(--tt-brand-color-400);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-300);--tt-button-active-icon-color-subdued: var(--tt-gray-dark-a-900);--tt-button-disabled-icon-color: var(--tt-gray-dark-a-400)}.tiptap-button[data-style=ghost]{--tt-button-default-icon-sub-color: var(--tt-gray-light-a-400);--tt-button-hover-icon-sub-color: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color: var(--tt-gray-light-a-400);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-light-a-400);--tt-button-disabled-icon-sub-color: var(--tt-gray-light-a-100)}.dark .tiptap-button[data-style=ghost]{--tt-button-default-icon-sub-color: var(--tt-gray-dark-a-300);--tt-button-hover-icon-sub-color: var(--tt-gray-dark-a-400);--tt-button-active-icon-sub-color: var(--tt-gray-dark-a-300);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-dark-a-400);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-dark-a-300);--tt-button-disabled-icon-sub-color: var(--tt-gray-dark-a-100)}.tiptap-button[data-style=ghost]{--tt-button-default-dropdown-arrows-color: var(--tt-gray-light-a-600);--tt-button-hover-dropdown-arrows-color: var(--tt-gray-light-a-700);--tt-button-active-dropdown-arrows-color: var(--tt-gray-light-a-600);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-light-a-700 );--tt-button-active-dropdown-arrows-color-subdued: var( --tt-gray-light-a-600 );--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=ghost]{--tt-button-default-dropdown-arrows-color: var(--tt-gray-dark-a-600);--tt-button-hover-dropdown-arrows-color: var(--tt-gray-dark-a-700);--tt-button-active-dropdown-arrows-color: var(--tt-gray-dark-a-600);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-dark-a-700 );--tt-button-active-dropdown-arrows-color-subdued: var( --tt-gray-dark-a-600 );--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-dark-a-400)}.tiptap-button[data-style=primary]{--tt-button-default-bg-color: var(--tt-brand-color-500);--tt-button-hover-bg-color: var(--tt-brand-color-600);--tt-button-active-bg-color: var(--tt-brand-color-100);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-100 );--tt-button-active-bg-color-subdued: var( --tt-brand-color-100 );--tt-button-active-hover-bg-color: var(--tt-brand-color-200);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-200 );--tt-button-active-hover-bg-color-subdued: var( --tt-brand-color-200 );--tt-button-disabled-bg-color: var(--tt-gray-light-a-100)}.dark .tiptap-button[data-style=primary]{--tt-button-default-bg-color: var(--tt-brand-color-500);--tt-button-hover-bg-color: var(--tt-brand-color-600);--tt-button-active-bg-color: var(--tt-brand-color-900);--tt-button-active-bg-color-emphasized: var( --tt-brand-color-900 );--tt-button-active-bg-color-subdued: var( --tt-brand-color-900 );--tt-button-active-hover-bg-color: var(--tt-brand-color-800);--tt-button-active-hover-bg-color-emphasized: var( --tt-brand-color-800 );--tt-button-active-hover-bg-color-subdued: var( --tt-brand-color-800 );--tt-button-disabled-bg-color: var(--tt-gray-dark-a-100)}.tiptap-button[data-style=primary]{--tt-button-default-text-color: var(--white);--tt-button-hover-text-color: var(--white);--tt-button-active-text-color: var(--tt-gray-light-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-light-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-light-a-900);--tt-button-disabled-text-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=primary]{--tt-button-default-text-color: var(--white);--tt-button-hover-text-color: var(--white);--tt-button-active-text-color: var(--tt-gray-dark-a-900);--tt-button-active-text-color-emphasized: var(--tt-gray-dark-a-900);--tt-button-active-text-color-subdued: var(--tt-gray-dark-a-900);--tt-button-disabled-text-color: var(--tt-gray-dark-a-300)}.tiptap-button[data-style=primary]{--tt-button-default-icon-color: var(--white);--tt-button-hover-icon-color: var(--white);--tt-button-active-icon-color: var(--tt-brand-color-600);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-600);--tt-button-active-icon-color-subdued: var(--tt-brand-color-600);--tt-button-disabled-icon-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=primary]{--tt-button-default-icon-color: var(--white);--tt-button-hover-icon-color: var(--white);--tt-button-active-icon-color: var(--tt-brand-color-400);--tt-button-active-icon-color-emphasized: var(--tt-brand-color-400);--tt-button-active-icon-color-subdued: var(--tt-brand-color-400);--tt-button-disabled-icon-color: var(--tt-gray-dark-a-300)}.tiptap-button[data-style=primary]{--tt-button-default-icon-sub-color: var(--tt-gray-dark-a-500);--tt-button-hover-icon-sub-color: var(--tt-gray-dark-a-500);--tt-button-active-icon-sub-color: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-light-a-500);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-light-a-500);--tt-button-disabled-icon-sub-color: var(--tt-gray-light-a-100)}.dark .tiptap-button[data-style=primary]{--tt-button-default-icon-sub-color: var(--tt-gray-dark-a-400);--tt-button-hover-icon-sub-color: var(--tt-gray-dark-a-500);--tt-button-active-icon-sub-color: var(--tt-gray-dark-a-300);--tt-button-active-icon-sub-color-emphasized: var(--tt-gray-dark-a-400);--tt-button-active-icon-sub-color-subdued: var(--tt-gray-dark-a-300);--tt-button-disabled-icon-sub-color: var(--tt-gray-dark-a-100)}.tiptap-button[data-style=primary]{--tt-button-default-dropdown-arrows-color: var(--white);--tt-button-hover-dropdown-arrows-color: var(--white);--tt-button-active-dropdown-arrows-color: var(--tt-gray-light-a-700);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-light-a-700 );--tt-button-active-dropdown-arrows-color-subdued: var( --tt-gray-light-a-700 );--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-light-a-400)}.dark .tiptap-button[data-style=primary]{--tt-button-default-dropdown-arrows-color: var(--white);--tt-button-hover-dropdown-arrows-color: var(--white);--tt-button-active-dropdown-arrows-color: var(--tt-gray-dark-a-600);--tt-button-active-dropdown-arrows-color-emphasized: var( --tt-gray-dark-a-600 );--tt-button-active-dropdown-arrows-color-subdued: var( --tt-gray-dark-a-600 );--tt-button-disabled-dropdown-arrows-color: var(--tt-gray-dark-a-400)}.tiptap-button-group{position:relative;display:flex;vertical-align:middle}.tiptap-button-group[data-orientation=vertical]{flex-direction:column;align-items:flex-start;justify-content:center;min-width:max-content}.tiptap-button-group[data-orientation=vertical]>.tiptap-button{width:100%}.tiptap-button-group[data-orientation=horizontal]{gap:.125rem;flex-direction:row;align-items:center}.tiptap-button{font-size:.875rem;font-weight:500;font-feature-settings:"salt" on,"cv01" on;line-height:1.15;height:2rem;min-width:2rem;border:none;padding:.5rem;gap:.25rem;display:flex;align-items:center;justify-content:center;border-radius:var(--tt-radius-lg, .75rem);transition-property:background,color,opacity;transition-duration:var(--tt-transition-duration-default);transition-timing-function:var(--tt-transition-easing-default)}.tiptap-button:focus-visible{outline:none}.tiptap-button[data-highlighted=true],.tiptap-button[data-focus-visible=true]{background-color:var(--tt-button-hover-bg-color);color:var(--tt-button-hover-text-color)}.tiptap-button[data-weight=small]{width:1.5rem;min-width:1.5rem;padding-right:0;padding-left:0}.tiptap-button[data-size=large]{font-size:.9375rem;height:2.375rem;min-width:2.375rem;padding:.625rem}.tiptap-button[data-size=small]{font-size:.75rem;line-height:1.2;height:1.5rem;min-width:1.5rem;padding:.3125rem;border-radius:var(--tt-radius-md, .5rem)}.tiptap-button .tiptap-button-text{padding:0 .125rem;flex-grow:1;text-align:left;line-height:1.5rem}.tiptap-button[data-text-trim=on] .tiptap-button-text{text-overflow:ellipsis;overflow:hidden}.tiptap-button .tiptap-button-icon,.tiptap-button .tiptap-button-icon-sub,.tiptap-button .tiptap-button-dropdown-arrows,.tiptap-button .tiptap-button-dropdown-small{flex-shrink:0}.tiptap-button .tiptap-button-icon{width:1rem;height:1rem}.tiptap-button[data-size=large] .tiptap-button-icon{width:1.125rem;height:1.125rem}.tiptap-button[data-size=small] .tiptap-button-icon{width:.875rem;height:.875rem}.tiptap-button .tiptap-button-icon-sub{width:1rem;height:1rem}.tiptap-button[data-size=large] .tiptap-button-icon-sub{width:1.125rem;height:1.125rem}.tiptap-button[data-size=small] .tiptap-button-icon-sub{width:.875rem;height:.875rem}.tiptap-button .tiptap-button-dropdown-arrows{width:.75rem;height:.75rem}.tiptap-button[data-size=large] .tiptap-button-dropdown-arrows{width:.875rem;height:.875rem}.tiptap-button[data-size=small] .tiptap-button-dropdown-arrows,.tiptap-button .tiptap-button-dropdown-small{width:.625rem;height:.625rem}.tiptap-button[data-size=large] .tiptap-button-dropdown-small{width:.75rem;height:.75rem}.tiptap-button[data-size=small] .tiptap-button-dropdown-small{width:.5rem;height:.5rem}.tiptap-button:has(>svg):not(:has(>:not(svg))){gap:.125rem}.tiptap-button:has(>svg):not(:has(>:not(svg)))[data-size=large],.tiptap-button:has(>svg):not(:has(>:not(svg)))[data-size=small]{gap:.125rem}.tiptap-button:has(>svg:nth-of-type(2)):has(>.tiptap-button-dropdown-small):not(:has(>svg:nth-of-type(3))):not(:has(>.tiptap-button-text)){gap:0;padding-right:.25rem}.tiptap-button:has(>svg:nth-of-type(2)):has(>.tiptap-button-dropdown-small):not(:has(>svg:nth-of-type(3))):not(:has(>.tiptap-button-text))[data-size=large]{padding-right:.375rem}.tiptap-button:has(>svg:nth-of-type(2)):has(>.tiptap-button-dropdown-small):not(:has(>svg:nth-of-type(3))):not(:has(>.tiptap-button-text))[data-size=small]{padding-right:.25rem}.tiptap-button .tiptap-button-emoji{width:1rem;display:flex;justify-content:center}.tiptap-button[data-size=large] .tiptap-button-emoji{width:1.125rem}.tiptap-button[data-size=small] .tiptap-button-emoji{width:.875rem}.tiptap-button{background-color:var(--tt-button-default-bg-color);color:var(--tt-button-default-text-color)}.tiptap-button .tiptap-button-icon{color:var(--tt-button-default-icon-color)}.tiptap-button .tiptap-button-icon-sub{color:var(--tt-button-default-icon-sub-color)}.tiptap-button .tiptap-button-dropdown-arrows,.tiptap-button .tiptap-button-dropdown-small{color:var(--tt-button-default-dropdown-arrows-color)}.tiptap-button:hover:not([data-active-item=true]):not([disabled]),.tiptap-button[data-active-item=true]:not([disabled]),.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted=false]){background-color:var(--tt-button-hover-bg-color);color:var(--tt-button-hover-text-color)}.tiptap-button:hover:not([data-active-item=true]):not([disabled]) .tiptap-button-icon,.tiptap-button[data-active-item=true]:not([disabled]) .tiptap-button-icon,.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted=false]) .tiptap-button-icon{color:var(--tt-button-hover-icon-color)}.tiptap-button:hover:not([data-active-item=true]):not([disabled]) .tiptap-button-icon-sub,.tiptap-button[data-active-item=true]:not([disabled]) .tiptap-button-icon-sub,.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted=false]) .tiptap-button-icon-sub{color:var(--tt-button-hover-icon-sub-color)}.tiptap-button:hover:not([data-active-item=true]):not([disabled]) .tiptap-button-dropdown-arrows,.tiptap-button:hover:not([data-active-item=true]):not([disabled]) .tiptap-button-dropdown-small,.tiptap-button[data-active-item=true]:not([disabled]) .tiptap-button-dropdown-arrows,.tiptap-button[data-active-item=true]:not([disabled]) .tiptap-button-dropdown-small,.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted=false]) .tiptap-button-dropdown-arrows,.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted=false]) .tiptap-button-dropdown-small{color:var(--tt-button-hover-dropdown-arrows-color)}.tiptap-button[data-active-state=on]:not([disabled]),.tiptap-button[data-state=open]:not([disabled]){background-color:var(--tt-button-active-bg-color);color:var(--tt-button-active-text-color)}.tiptap-button[data-active-state=on]:not([disabled]) .tiptap-button-icon,.tiptap-button[data-state=open]:not([disabled]) .tiptap-button-icon{color:var(--tt-button-active-icon-color)}.tiptap-button[data-active-state=on]:not([disabled]) .tiptap-button-icon-sub,.tiptap-button[data-state=open]:not([disabled]) .tiptap-button-icon-sub{color:var(--tt-button-active-icon-sub-color)}.tiptap-button[data-active-state=on]:not([disabled]) .tiptap-button-dropdown-arrows,.tiptap-button[data-active-state=on]:not([disabled]) .tiptap-button-dropdown-small,.tiptap-button[data-state=open]:not([disabled]) .tiptap-button-dropdown-arrows,.tiptap-button[data-state=open]:not([disabled]) .tiptap-button-dropdown-small{color:var(--tt-button-active-dropdown-arrows-color)}.tiptap-button[data-active-state=on]:not([disabled]):hover,.tiptap-button[data-state=open]:not([disabled]):hover{background-color:var(--tt-button-active-hover-bg-color)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized],.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized]{background-color:var(--tt-button-active-bg-color-emphasized);color:var(--tt-button-active-text-color-emphasized)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized] .tiptap-button-icon,.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized] .tiptap-button-icon{color:var(--tt-button-active-icon-color-emphasized)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized] .tiptap-button-icon-sub,.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized] .tiptap-button-icon-sub{color:var(--tt-button-active-icon-sub-color-emphasized)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized] .tiptap-button-dropdown-arrows,.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized] .tiptap-button-dropdown-small,.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized] .tiptap-button-dropdown-arrows,.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized] .tiptap-button-dropdown-small{color:var(--tt-button-active-dropdown-arrows-color-emphasized)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=emphasized]:hover,.tiptap-button[data-state=open]:not([disabled])[data-appearance=emphasized]:hover{background-color:var(--tt-button-active-hover-bg-color-emphasized)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued],.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued]{background-color:var(--tt-button-active-bg-color-subdued);color:var(--tt-button-active-text-color-subdued)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued] .tiptap-button-icon,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued] .tiptap-button-icon{color:var(--tt-button-active-icon-color-subdued)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued] .tiptap-button-icon-sub,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued] .tiptap-button-icon-sub{color:var(--tt-button-active-icon-sub-color-subdued)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued] .tiptap-button-dropdown-arrows,.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued] .tiptap-button-dropdown-small,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued] .tiptap-button-dropdown-arrows,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued] .tiptap-button-dropdown-small{color:var(--tt-button-active-dropdown-arrows-color-subdued)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued]:hover,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued]:hover{background-color:var(--tt-button-active-hover-bg-color-subdued)}.tiptap-button[data-active-state=on]:not([disabled])[data-appearance=subdued]:hover .tiptap-button-icon,.tiptap-button[data-state=open]:not([disabled])[data-appearance=subdued]:hover .tiptap-button-icon{color:var(--tt-button-active-icon-color-subdued)}.tiptap-button:disabled{background-color:var(--tt-button-disabled-bg-color);color:var(--tt-button-disabled-text-color)}.tiptap-button:disabled .tiptap-button-icon{color:var(--tt-button-disabled-icon-color)}.tiptap-badge{--tt-badge-border-color: var(--tt-gray-light-a-200);--tt-badge-border-color-subdued: var(--tt-gray-light-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-light-a-600);--tt-badge-text-color: var(--tt-gray-light-a-500);--tt-badge-text-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-text-color-emphasized: var( --tt-gray-light-a-600 );--tt-badge-bg-color: var(--white);--tt-badge-bg-color-subdued: var(--white);--tt-badge-bg-color-emphasized: var(--white);--tt-badge-icon-color: var(--tt-gray-light-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-600 )}.dark .tiptap-badge{--tt-badge-border-color: var(--tt-gray-dark-a-200);--tt-badge-border-color-subdued: var(--tt-gray-dark-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-dark-a-500);--tt-badge-text-color: var(--tt-gray-dark-a-500);--tt-badge-text-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-text-color-emphasized: var( --tt-gray-dark-a-600 );--tt-badge-bg-color: var(--black);--tt-badge-bg-color-subdued: var(--black);--tt-badge-bg-color-emphasized: var(--black);--tt-badge-icon-color: var(--tt-gray-dark-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-400 )}.tiptap-badge[data-style=ghost]{--tt-badge-border-color: var(--tt-gray-light-a-200);--tt-badge-border-color-subdued: var(--tt-gray-light-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-light-a-600);--tt-badge-text-color: var(--tt-gray-light-a-500);--tt-badge-text-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-text-color-emphasized: var( --tt-gray-light-a-600 );--tt-badge-bg-color: var(--transparent);--tt-badge-bg-color-subdued: var(--transparent);--tt-badge-bg-color-emphasized: var(--transparent);--tt-badge-icon-color: var(--tt-gray-light-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-600 )}.dark .tiptap-badge[data-style=ghost]{--tt-badge-border-color: var(--tt-gray-dark-a-200);--tt-badge-border-color-subdued: var(--tt-gray-dark-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-dark-a-500);--tt-badge-text-color: var(--tt-gray-dark-a-500);--tt-badge-text-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-text-color-emphasized: var( --tt-gray-dark-a-600 );--tt-badge-bg-color: var(--transparent);--tt-badge-bg-color-subdued: var(--transparent);--tt-badge-bg-color-emphasized: var(--transparent);--tt-badge-icon-color: var(--tt-gray-dark-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-400 )}.tiptap-badge[data-style=gray]{--tt-badge-border-color: var(--tt-gray-light-a-200);--tt-badge-border-color-subdued: var(--tt-gray-light-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-light-a-500);--tt-badge-text-color: var(--tt-gray-light-a-500);--tt-badge-text-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-text-color-emphasized: var(--white);--tt-badge-bg-color: var(--tt-gray-light-a-100);--tt-badge-bg-color-subdued: var( --tt-gray-light-a-50 );--tt-badge-bg-color-emphasized: var( --tt-gray-light-a-700 );--tt-badge-icon-color: var(--tt-gray-light-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-light-a-400 );--tt-badge-icon-color-emphasized: var(--white)}.dark .tiptap-badge[data-style=gray]{--tt-badge-border-color: var(--tt-gray-dark-a-200);--tt-badge-border-color-subdued: var(--tt-gray-dark-a-200);--tt-badge-border-color-emphasized: var(--tt-gray-dark-a-500);--tt-badge-text-color: var(--tt-gray-dark-a-500);--tt-badge-text-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-text-color-emphasized: var(--black);--tt-badge-bg-color: var(--tt-gray-dark-a-100);--tt-badge-bg-color-subdued: var( --tt-gray-dark-a-50 );--tt-badge-bg-color-emphasized: var( --tt-gray-dark-a-800 );--tt-badge-icon-color: var(--tt-gray-dark-a-500);--tt-badge-icon-color-subdued: var( --tt-gray-dark-a-400 );--tt-badge-icon-color-emphasized: var(--black)}.tiptap-badge[data-style=green]{--tt-badge-border-color: var(--tt-color-green-inc-2);--tt-badge-border-color-subdued: var(--tt-color-green-inc-3);--tt-badge-border-color-emphasized: var(--tt-color-green-dec-2);--tt-badge-text-color: var(--tt-color-green-dec-3);--tt-badge-text-color-subdued: var( --tt-color-green-dec-2 );--tt-badge-text-color-emphasized: var( --tt-color-green-inc-5 );--tt-badge-bg-color: var(--tt-color-green-inc-4);--tt-badge-bg-color-subdued: var( --tt-color-green-inc-5 );--tt-badge-bg-color-emphasized: var( --tt-color-green-dec-1 );--tt-badge-icon-color: var(--tt-color-green-dec-3);--tt-badge-icon-color-subdued: var( --tt-color-green-dec-2 );--tt-badge-icon-color-emphasized: var( --tt-color-green-inc-5 )}.dark .tiptap-badge[data-style=green]{--tt-badge-border-color: var(--tt-color-green-dec-2);--tt-badge-border-color-subdued: var(--tt-color-green-dec-3);--tt-badge-border-color-emphasized: var(--tt-color-green-base);--tt-badge-text-color: var(--tt-color-green-inc-3);--tt-badge-text-color-subdued: var( --tt-color-green-inc-2 );--tt-badge-text-color-emphasized: var( --tt-color-green-dec-5 );--tt-badge-bg-color: var(--tt-color-green-dec-4);--tt-badge-bg-color-subdued: var( --tt-color-green-dec-5 );--tt-badge-bg-color-emphasized: var( --tt-color-green-inc-1 );--tt-badge-icon-color: var(--tt-color-green-inc-3);--tt-badge-icon-color-subdued: var( --tt-color-green-inc-2 );--tt-badge-icon-color-emphasized: var( --tt-color-green-dec-5 )}.tiptap-badge[data-style=yellow]{--tt-badge-border-color: var(--tt-color-yellow-inc-2);--tt-badge-border-color-subdued: var(--tt-color-yellow-inc-3);--tt-badge-border-color-emphasized: var(--tt-color-yellow-dec-1);--tt-badge-text-color: var(--tt-color-yellow-dec-3);--tt-badge-text-color-subdued: var( --tt-color-yellow-dec-2 );--tt-badge-text-color-emphasized: var( --tt-color-yellow-dec-3 );--tt-badge-bg-color: var(--tt-color-yellow-inc-4);--tt-badge-bg-color-subdued: var( --tt-color-yellow-inc-5 );--tt-badge-bg-color-emphasized: var( --tt-color-yellow-base );--tt-badge-icon-color: var(--tt-color-yellow-dec-3);--tt-badge-icon-color-subdued: var( --tt-color-yellow-dec-2 );--tt-badge-icon-color-emphasized: var( --tt-color-yellow-dec-3 )}.dark .tiptap-badge[data-style=yellow]{--tt-badge-border-color: var(--tt-color-yellow-dec-2);--tt-badge-border-color-subdued: var(--tt-color-yellow-dec-3);--tt-badge-border-color-emphasized: var(--tt-color-yellow-inc-1);--tt-badge-text-color: var(--tt-color-yellow-inc-3);--tt-badge-text-color-subdued: var( --tt-color-yellow-inc-2 );--tt-badge-text-color-emphasized: var( --tt-color-yellow-dec-3 );--tt-badge-bg-color: var(--tt-color-yellow-dec-4);--tt-badge-bg-color-subdued: var( --tt-color-yellow-dec-5 );--tt-badge-bg-color-emphasized: var( --tt-color-yellow-base );--tt-badge-icon-color: var(--tt-color-yellow-inc-3);--tt-badge-icon-color-subdued: var( --tt-color-yellow-inc-2 );--tt-badge-icon-color-emphasized: var( --tt-color-yellow-dec-3 )}.tiptap-badge[data-style=red]{--tt-badge-border-color: var(--tt-color-red-inc-2);--tt-badge-border-color-subdued: var(--tt-color-red-inc-3);--tt-badge-border-color-emphasized: var(--tt-color-red-dec-2);--tt-badge-text-color: var(--tt-color-red-dec-3);--tt-badge-text-color-subdued: var( --tt-color-red-dec-2 );--tt-badge-text-color-emphasized: var( --tt-color-red-inc-5 );--tt-badge-bg-color: var(--tt-color-red-inc-4);--tt-badge-bg-color-subdued: var( --tt-color-red-inc-5 );--tt-badge-bg-color-emphasized: var( --tt-color-red-dec-1 );--tt-badge-icon-color: var(--tt-color-red-dec-3);--tt-badge-icon-color-subdued: var( --tt-color-red-dec-2 );--tt-badge-icon-color-emphasized: var( --tt-color-red-inc-5 )}.dark .tiptap-badge[data-style=red]{--tt-badge-border-color: var(--tt-color-red-dec-2);--tt-badge-border-color-subdued: var(--tt-color-red-dec-3);--tt-badge-border-color-emphasized: var(--tt-color-red-base);--tt-badge-text-color: var(--tt-color-red-inc-3);--tt-badge-text-color-subdued: var( --tt-color-red-inc-2 );--tt-badge-text-color-emphasized: var( --tt-color-red-dec-5 );--tt-badge-bg-color: var(--tt-color-red-dec-4);--tt-badge-bg-color-subdued: var( --tt-color-red-dec-5 );--tt-badge-bg-color-emphasized: var( --tt-color-red-inc-1 );--tt-badge-icon-color: var(--tt-color-red-inc-3);--tt-badge-icon-color-subdued: var( --tt-color-red-inc-2 );--tt-badge-icon-color-emphasized: var( --tt-color-red-dec-5 )}.tiptap-badge[data-style=brand]{--tt-badge-border-color: var(--tt-brand-color-300);--tt-badge-border-color-subdued: var(--tt-brand-color-200);--tt-badge-border-color-emphasized: var(--tt-brand-color-600);--tt-badge-text-color: var(--tt-brand-color-800);--tt-badge-text-color-subdued: var( --tt-brand-color-700 );--tt-badge-text-color-emphasized: var( --tt-brand-color-50 );--tt-badge-bg-color: var(--tt-brand-color-100);--tt-badge-bg-color-subdued: var( --tt-brand-color-50 );--tt-badge-bg-color-emphasized: var( --tt-brand-color-600 );--tt-badge-icon-color: var(--tt-brand-color-800);--tt-badge-icon-color-subdued: var( --tt-brand-color-700 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-100 )}.dark .tiptap-badge[data-style=brand]{--tt-badge-border-color: var(--tt-brand-color-700);--tt-badge-border-color-subdued: var(--tt-brand-color-800);--tt-badge-border-color-emphasized: var(--tt-brand-color-400);--tt-badge-text-color: var(--tt-brand-color-200);--tt-badge-text-color-subdued: var( --tt-brand-color-300 );--tt-badge-text-color-emphasized: var( --tt-brand-color-950 );--tt-badge-bg-color: var(--tt-brand-color-900);--tt-badge-bg-color-subdued: var( --tt-brand-color-950 );--tt-badge-bg-color-emphasized: var( --tt-brand-color-400 );--tt-badge-icon-color: var(--tt-brand-color-200);--tt-badge-icon-color-subdued: var( --tt-brand-color-300 );--tt-badge-icon-color-emphasized: var( --tt-brand-color-900 )}.tiptap-badge-group{align-items:center;display:flex;flex-wrap:wrap;gap:.25rem}.tiptap-badge-group [data-orientation=vertical]{flex-direction:column}.tiptap-badge-group [data-orientation=horizontal]{flex-direction:row}.tiptap-badge{font-size:.625rem;font-weight:700;font-feature-settings:"salt" on,"cv01" on;line-height:1.15;height:1.25rem;min-width:1.25rem;padding:.25rem;display:flex;align-items:center;justify-content:center;border:solid 1px;border-radius:var(--tt-radius-sm, .375rem);transition-property:background,color,opacity;transition-duration:var(--tt-transition-duration-default);transition-timing-function:var(--tt-transition-easing-default)}.tiptap-badge[data-size=large]{font-size:.75rem;height:1.5rem;min-width:1.5rem;padding:.375rem;border-radius:var(--tt-radius-md, .375rem)}.tiptap-badge[data-size=small]{height:1rem;min-width:1rem;padding:.125rem;border-radius:var(--tt-radius-xs, .25rem)}.tiptap-badge .tiptap-badge-text{padding:0 .125rem;flex-grow:1;text-align:left}.tiptap-badge[data-text-trim=on] .tiptap-badge-text{text-overflow:ellipsis;overflow:hidden}.tiptap-badge .tiptap-badge-icon{pointer-events:none;flex-shrink:0;width:.625rem;height:.625rem}.tiptap-badge[data-size=large] .tiptap-badge-icon{width:.75rem;height:.75rem}.tiptap-badge{background-color:var(--tt-badge-bg-color);border-color:var(--tt-badge-border-color);color:var(--tt-badge-text-color)}.tiptap-badge .tiptap-badge-icon{color:var(--tt-badge-icon-color)}.tiptap-badge[data-appearance=emphasized]{background-color:var(--tt-badge-bg-color-emphasized);border-color:var(--tt-badge-border-color-emphasized);color:var(--tt-badge-text-color-emphasized)}.tiptap-badge[data-appearance=emphasized] .tiptap-badge-icon{color:var(--tt-badge-icon-color-emphasized)}.tiptap-badge[data-appearance=subdued]{background-color:var(--tt-badge-bg-color-subdued);border-color:var(--tt-badge-border-color-subdued);color:var(--tt-badge-text-color-subdued)}.tiptap-badge[data-appearance=subdued] .tiptap-badge-icon{color:var(--tt-badge-icon-color-subdued)}.tiptap-popover{--tt-popover-bg-color: var(--white);--tt-popover-border-color: var(--tt-gray-light-a-100);--tt-popover-text-color: var(--tt-gray-light-a-600)}.dark .tiptap-popover{--tt-popover-border-color: var(--tt-gray-dark-a-50);--tt-popover-bg-color: var(--tt-gray-dark-50);--tt-popover-text-color: var(--tt-gray-dark-a-600)}.tiptap-popover{z-index:50;outline:none;transform-origin:var(--radix-popover-content-transform-origin);max-height:var(--radix-popover-content-available-height)}.tiptap-popover>*{max-height:var(--radix-popover-content-available-height)}.tiptap-popover[data-state=open]{animation:fadeIn .15s cubic-bezier(.16,1,.3,1),zoomIn .15s cubic-bezier(.16,1,.3,1)}.tiptap-popover[data-state=closed]{animation:fadeOut .15s cubic-bezier(.16,1,.3,1),zoomOut .15s cubic-bezier(.16,1,.3,1)}.tiptap-popover[data-side=top],.tiptap-popover[data-side=top-start],.tiptap-popover[data-side=top-end]{animation:slideFromBottom .15s cubic-bezier(.16,1,.3,1)}.tiptap-popover[data-side=right],.tiptap-popover[data-side=right-start],.tiptap-popover[data-side=right-end]{animation:slideFromLeft .15s cubic-bezier(.16,1,.3,1)}.tiptap-popover[data-side=bottom],.tiptap-popover[data-side=bottom-start],.tiptap-popover[data-side=bottom-end]{animation:slideFromTop .15s cubic-bezier(.16,1,.3,1)}.tiptap-popover[data-side=left],.tiptap-popover[data-side=left-start],.tiptap-popover[data-side=left-end]{animation:slideFromRight .15s cubic-bezier(.16,1,.3,1)}:root{--tiptap-card-bg-color: var(--white);--tiptap-card-border-color: var(--tt-gray-light-a-100);--tiptap-card-group-label-color: var(--tt-gray-light-a-800)}.dark{--tiptap-card-bg-color: var(--tt-gray-dark-50);--tiptap-card-border-color: var(--tt-gray-dark-a-100);--tiptap-card-group-label-color: var(--tt-gray-dark-a-800)}.tiptap-card{--padding: .375rem;--border-width: 1px;border-radius:calc(var(--padding) + var(--tt-radius-lg));box-shadow:var(--tt-shadow-elevated-md);background-color:var(--tiptap-card-bg-color);border:1px solid var(--tiptap-card-border-color);display:flex;flex-direction:column;outline:none;align-items:center;position:relative;min-width:0;word-wrap:break-word;background-clip:border-box}.tiptap-card-header{padding:.375rem;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;width:100%;border-bottom:var(--border-width) solid var(--tiptap-card-border-color)}.tiptap-card-body{padding:.375rem;flex:1 1 auto;overflow-y:auto}.tiptap-card-item-group{position:relative;display:flex;vertical-align:middle;min-width:max-content}.tiptap-card-item-group[data-orientation=vertical]{flex-direction:column;justify-content:center}.tiptap-card-item-group[data-orientation=horizontal]{gap:.25rem;flex-direction:row;align-items:center}.tiptap-card-group-label{padding:.75rem .5rem .25rem;font-size:.75rem;font-weight:600;line-height:normal;text-transform:capitalize;color:var(--tiptap-card-group-label-color)}.tiptap-dropdown-menu{--tt-dropdown-menu-bg-color: var(--white);--tt-dropdown-menu-border-color: var(--tt-gray-light-a-100);--tt-dropdown-menu-text-color: var(--tt-gray-light-a-600)}.dark .tiptap-dropdown-menu{--tt-dropdown-menu-border-color: var(--tt-gray-dark-a-50);--tt-dropdown-menu-bg-color: var(--tt-gray-dark-50);--tt-dropdown-menu-text-color: var(--tt-gray-dark-a-600)}.tiptap-dropdown-menu{z-index:50;outline:none;transform-origin:var(--radix-dropdown-menu-content-transform-origin);max-height:var(--radix-dropdown-menu-content-available-height)}.tiptap-dropdown-menu>*{max-height:var(--radix-dropdown-menu-content-available-height)}.tiptap-dropdown-menu[data-state=open]{animation:fadeIn .15s cubic-bezier(.16,1,.3,1),zoomIn .15s cubic-bezier(.16,1,.3,1)}.tiptap-dropdown-menu[data-state=closed]{animation:fadeOut .15s cubic-bezier(.16,1,.3,1),zoomOut .15s cubic-bezier(.16,1,.3,1)}.tiptap-dropdown-menu[data-side=top],.tiptap-dropdown-menu[data-side=top-start],.tiptap-dropdown-menu[data-side=top-end]{animation:slideFromBottom .15s cubic-bezier(.16,1,.3,1)}.tiptap-dropdown-menu[data-side=right],.tiptap-dropdown-menu[data-side=right-start],.tiptap-dropdown-menu[data-side=right-end]{animation:slideFromLeft .15s cubic-bezier(.16,1,.3,1)}.tiptap-dropdown-menu[data-side=bottom],.tiptap-dropdown-menu[data-side=bottom-start],.tiptap-dropdown-menu[data-side=bottom-end]{animation:slideFromTop .15s cubic-bezier(.16,1,.3,1)}.tiptap-dropdown-menu[data-side=left],.tiptap-dropdown-menu[data-side=left-start],.tiptap-dropdown-menu[data-side=left-end]{animation:slideFromRight .15s cubic-bezier(.16,1,.3,1)}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ButtonProps } from '../tiptap-ui-primitive/button';
|
|
2
|
+
import { Editor } from '@tiptap/react';
|
|
3
|
+
interface UseColorTextPopoverConfig {
|
|
4
|
+
editor?: Editor | null;
|
|
5
|
+
hideWhenUnavailable?: boolean;
|
|
6
|
+
onExecuted?: () => void;
|
|
7
|
+
}
|
|
8
|
+
interface ColorTextPopoverProps extends ButtonProps, UseColorTextPopoverConfig {
|
|
9
|
+
}
|
|
10
|
+
export declare const ColorTextPopover: import('react').ForwardRefExoticComponent<ColorTextPopoverProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Editor } from '@tiptap/react';
|
|
2
|
+
import { ButtonProps } from '../tiptap-ui-primitive/button';
|
|
3
|
+
interface UseTableCellBackgroundColorPopoverConfig {
|
|
4
|
+
editor?: Editor | null;
|
|
5
|
+
hideWhenUnavailable?: boolean;
|
|
6
|
+
onExecuted?: () => void;
|
|
7
|
+
}
|
|
8
|
+
interface TableCellBackgroundColorPopoverProps extends ButtonProps, UseTableCellBackgroundColorPopoverConfig {
|
|
9
|
+
}
|
|
10
|
+
export declare const TableCellBackgroundColorPopover: import('react').ForwardRefExoticComponent<TableCellBackgroundColorPopoverProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
export declare const colors: readonly [{
|
|
2
|
+
readonly name: "Default";
|
|
3
|
+
readonly color: "#ffffff";
|
|
4
|
+
readonly contrastColor: "#374151";
|
|
5
|
+
}, {
|
|
6
|
+
readonly name: "Gray";
|
|
7
|
+
readonly color: "#f3f4f6";
|
|
8
|
+
readonly contrastColor: "#6b7280";
|
|
9
|
+
}, {
|
|
10
|
+
readonly name: "Brown";
|
|
11
|
+
readonly color: "#f4eef8";
|
|
12
|
+
readonly contrastColor: "#92400e";
|
|
13
|
+
}, {
|
|
14
|
+
readonly name: "Orange";
|
|
15
|
+
readonly color: "#fff7ed";
|
|
16
|
+
readonly contrastColor: "#ea580c";
|
|
17
|
+
}, {
|
|
18
|
+
readonly name: "Yellow";
|
|
19
|
+
readonly color: "#fef9c3";
|
|
20
|
+
readonly contrastColor: "#ca8a04";
|
|
21
|
+
}, {
|
|
22
|
+
readonly name: "Green";
|
|
23
|
+
readonly color: "#dcfce7";
|
|
24
|
+
readonly contrastColor: "#16a34a";
|
|
25
|
+
}, {
|
|
26
|
+
readonly name: "Blue";
|
|
27
|
+
readonly color: "#e0f2fe";
|
|
28
|
+
readonly contrastColor: "#0284c7";
|
|
29
|
+
}, {
|
|
30
|
+
readonly name: "Purple";
|
|
31
|
+
readonly color: "#f3e8ff";
|
|
32
|
+
readonly contrastColor: "#7c3aed";
|
|
33
|
+
}, {
|
|
34
|
+
readonly name: "Pink";
|
|
35
|
+
readonly color: "#fce7f3";
|
|
36
|
+
readonly contrastColor: "#db2777";
|
|
37
|
+
}, {
|
|
38
|
+
readonly name: "Red";
|
|
39
|
+
readonly color: "#ffe4e6";
|
|
40
|
+
readonly contrastColor: "#dc2626";
|
|
41
|
+
}];
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Level, UseHeadingConfig } from '.';
|
|
2
|
+
import { ButtonProps } from '../../tiptap-ui-primitive/button';
|
|
3
|
+
export interface HeadingButtonProps extends Omit<ButtonProps, "type">, UseHeadingConfig {
|
|
4
|
+
/**
|
|
5
|
+
* Optional text to display alongside the icon.
|
|
6
|
+
*/
|
|
7
|
+
text?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Optional show shortcut keys in the button.
|
|
10
|
+
* @default false
|
|
11
|
+
*/
|
|
12
|
+
showShortcut?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare function HeadingShortcutBadge({ level, shortcutKeys, }: {
|
|
15
|
+
level: Level;
|
|
16
|
+
shortcutKeys?: string;
|
|
17
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
/**
|
|
19
|
+
* Button component for toggling heading in a Tiptap editor.
|
|
20
|
+
*
|
|
21
|
+
* For custom button implementations, use the `useHeading` hook instead.
|
|
22
|
+
*/
|
|
23
|
+
export declare const HeadingButton: import('react').ForwardRefExoticComponent<HeadingButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { Editor } from '@tiptap/react';
|
|
2
|
+
export type Level = 1 | 2 | 3 | 4 | 5 | 6;
|
|
3
|
+
/**
|
|
4
|
+
* Configuration for the heading functionality
|
|
5
|
+
*/
|
|
6
|
+
export interface UseHeadingConfig {
|
|
7
|
+
/**
|
|
8
|
+
* The Tiptap editor instance.
|
|
9
|
+
*/
|
|
10
|
+
editor?: Editor | null;
|
|
11
|
+
/**
|
|
12
|
+
* The heading level.
|
|
13
|
+
*/
|
|
14
|
+
level: Level;
|
|
15
|
+
/**
|
|
16
|
+
* Whether the button should hide when heading is not available.
|
|
17
|
+
* @default false
|
|
18
|
+
*/
|
|
19
|
+
hideWhenUnavailable?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* Callback function called after a successful heading toggle.
|
|
22
|
+
*/
|
|
23
|
+
onToggled?: () => void;
|
|
24
|
+
}
|
|
25
|
+
export declare const headingIcons: {
|
|
26
|
+
1: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
27
|
+
2: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
28
|
+
3: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
29
|
+
4: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
30
|
+
5: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
31
|
+
6: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
32
|
+
};
|
|
33
|
+
export declare const HEADING_SHORTCUT_KEYS: Record<Level, string>;
|
|
34
|
+
/**
|
|
35
|
+
* Checks if heading can be toggled in the current editor state
|
|
36
|
+
*/
|
|
37
|
+
export declare function canToggle(editor: Editor | null, level?: Level, turnInto?: boolean): boolean;
|
|
38
|
+
/**
|
|
39
|
+
* Checks if heading is currently active
|
|
40
|
+
*/
|
|
41
|
+
export declare function isHeadingActive(editor: Editor | null, level?: Level | Level[]): boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Toggles heading in the editor
|
|
44
|
+
*/
|
|
45
|
+
export declare function toggleHeading(editor: Editor | null, level: Level | Level[]): boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Determines if the heading button should be shown
|
|
48
|
+
*/
|
|
49
|
+
export declare function shouldShowButton(props: {
|
|
50
|
+
editor: Editor | null;
|
|
51
|
+
level?: Level | Level[];
|
|
52
|
+
hideWhenUnavailable: boolean;
|
|
53
|
+
}): boolean;
|
|
54
|
+
/**
|
|
55
|
+
* Custom hook that provides heading functionality for Tiptap editor
|
|
56
|
+
*
|
|
57
|
+
* @example
|
|
58
|
+
* ```tsx
|
|
59
|
+
* // Simple usage
|
|
60
|
+
* function MySimpleHeadingButton() {
|
|
61
|
+
* const { isVisible, isActive, handleToggle, Icon } = useHeading({ level: 1 })
|
|
62
|
+
*
|
|
63
|
+
* if (!isVisible) return null
|
|
64
|
+
*
|
|
65
|
+
* return (
|
|
66
|
+
* <button
|
|
67
|
+
* onClick={handleToggle}
|
|
68
|
+
* aria-pressed={isActive}
|
|
69
|
+
* >
|
|
70
|
+
* <Icon />
|
|
71
|
+
* Heading 1
|
|
72
|
+
* </button>
|
|
73
|
+
* )
|
|
74
|
+
* }
|
|
75
|
+
*
|
|
76
|
+
* // Advanced usage with configuration
|
|
77
|
+
* function MyAdvancedHeadingButton() {
|
|
78
|
+
* const { isVisible, isActive, handleToggle, label, Icon } = useHeading({
|
|
79
|
+
* level: 2,
|
|
80
|
+
* editor: myEditor,
|
|
81
|
+
* hideWhenUnavailable: true,
|
|
82
|
+
* onToggled: (isActive) => console.log('Heading toggled:', isActive)
|
|
83
|
+
* })
|
|
84
|
+
*
|
|
85
|
+
* if (!isVisible) return null
|
|
86
|
+
*
|
|
87
|
+
* return (
|
|
88
|
+
* <MyButton
|
|
89
|
+
* onClick={handleToggle}
|
|
90
|
+
* aria-label={label}
|
|
91
|
+
* aria-pressed={isActive}
|
|
92
|
+
* >
|
|
93
|
+
* <Icon />
|
|
94
|
+
* Toggle Heading 2
|
|
95
|
+
* </MyButton>
|
|
96
|
+
* )
|
|
97
|
+
* }
|
|
98
|
+
* ```
|
|
99
|
+
*/
|
|
100
|
+
export declare function useHeading(config: UseHeadingConfig): {
|
|
101
|
+
isVisible: boolean;
|
|
102
|
+
isActive: boolean;
|
|
103
|
+
handleToggle: () => boolean;
|
|
104
|
+
canToggle: boolean;
|
|
105
|
+
label: string;
|
|
106
|
+
shortcutKeys: string;
|
|
107
|
+
Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
108
|
+
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { UseHeadingDropdownMenuConfig } from '.';
|
|
2
|
+
import { ButtonProps } from '../../tiptap-ui-primitive/button';
|
|
3
|
+
export interface HeadingDropdownMenuProps extends Omit<ButtonProps, "type">, UseHeadingDropdownMenuConfig {
|
|
4
|
+
/**
|
|
5
|
+
* Whether to render the dropdown menu in a portal
|
|
6
|
+
* @default false
|
|
7
|
+
*/
|
|
8
|
+
portal?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* Callback for when the dropdown opens or closes
|
|
11
|
+
*/
|
|
12
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Dropdown menu component for selecting heading levels in a Tiptap editor.
|
|
16
|
+
*
|
|
17
|
+
* For custom dropdown implementations, use the `useHeadingDropdownMenu` hook instead.
|
|
18
|
+
*/
|
|
19
|
+
export declare const HeadingDropdownMenu: import('react').ForwardRefExoticComponent<HeadingDropdownMenuProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
20
|
+
export default HeadingDropdownMenu;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import { Editor } from '@tiptap/react';
|
|
2
|
+
import { Level } from '../heading-button';
|
|
3
|
+
/**
|
|
4
|
+
* Configuration for the heading dropdown menu functionality
|
|
5
|
+
*/
|
|
6
|
+
export interface UseHeadingDropdownMenuConfig {
|
|
7
|
+
/**
|
|
8
|
+
* The Tiptap editor instance.
|
|
9
|
+
*/
|
|
10
|
+
editor?: Editor | null;
|
|
11
|
+
/**
|
|
12
|
+
* Available heading levels to show in the dropdown
|
|
13
|
+
* @default [1, 2, 3, 4, 5, 6]
|
|
14
|
+
*/
|
|
15
|
+
levels?: Level[];
|
|
16
|
+
/**
|
|
17
|
+
* Whether the dropdown should hide when headings are not available.
|
|
18
|
+
* @default false
|
|
19
|
+
*/
|
|
20
|
+
hideWhenUnavailable?: boolean;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Gets the currently active heading level from the available levels
|
|
24
|
+
*/
|
|
25
|
+
export declare function getActiveHeadingLevel(editor: Editor | null, levels?: Level[]): Level | undefined;
|
|
26
|
+
/**
|
|
27
|
+
* Custom hook that provides heading dropdown menu functionality for Tiptap editor
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* // Simple usage
|
|
32
|
+
* function MyHeadingDropdown() {
|
|
33
|
+
* const {
|
|
34
|
+
* isVisible,
|
|
35
|
+
* activeLevel,
|
|
36
|
+
* isAnyHeadingActive,
|
|
37
|
+
* canToggle,
|
|
38
|
+
* levels,
|
|
39
|
+
* } = useHeadingDropdownMenu()
|
|
40
|
+
*
|
|
41
|
+
* if (!isVisible) return null
|
|
42
|
+
*
|
|
43
|
+
* return (
|
|
44
|
+
* <DropdownMenu>
|
|
45
|
+
* // dropdown content
|
|
46
|
+
* </DropdownMenu>
|
|
47
|
+
* )
|
|
48
|
+
* }
|
|
49
|
+
*
|
|
50
|
+
* // Advanced usage with configuration
|
|
51
|
+
* function MyAdvancedHeadingDropdown() {
|
|
52
|
+
* const {
|
|
53
|
+
* isVisible,
|
|
54
|
+
* activeLevel,
|
|
55
|
+
* } = useHeadingDropdownMenu({
|
|
56
|
+
* editor: myEditor,
|
|
57
|
+
* levels: [1, 2, 3],
|
|
58
|
+
* hideWhenUnavailable: true,
|
|
59
|
+
* })
|
|
60
|
+
*
|
|
61
|
+
* // component implementation
|
|
62
|
+
* }
|
|
63
|
+
* ```
|
|
64
|
+
*/
|
|
65
|
+
export declare function useHeadingDropdownMenu(config?: UseHeadingDropdownMenuConfig): {
|
|
66
|
+
isVisible: boolean;
|
|
67
|
+
activeLevel: Level | undefined;
|
|
68
|
+
isActive: boolean;
|
|
69
|
+
canToggle: boolean;
|
|
70
|
+
levels: Level[];
|
|
71
|
+
label: string;
|
|
72
|
+
Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
|
|
73
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { ButtonProps } from '../../tiptap-ui-primitive/button';
|
|
2
|
+
import { ListType, UseListConfig } from '.';
|
|
3
|
+
export interface ListButtonProps extends Omit<ButtonProps, "type">, UseListConfig {
|
|
4
|
+
/**
|
|
5
|
+
* Optional text to display alongside the icon.
|
|
6
|
+
*/
|
|
7
|
+
text?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Optional show shortcut keys in the button.
|
|
10
|
+
* @default false
|
|
11
|
+
*/
|
|
12
|
+
showShortcut?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare function ListShortcutBadge({ type, shortcutKeys, }: {
|
|
15
|
+
type: ListType;
|
|
16
|
+
shortcutKeys?: string;
|
|
17
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
/**
|
|
19
|
+
* Button component for toggling lists in a Tiptap editor.
|
|
20
|
+
*
|
|
21
|
+
* For custom button implementations, use the `useList` hook instead.
|
|
22
|
+
*/
|
|
23
|
+
export declare const ListButton: import('react').ForwardRefExoticComponent<ListButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
|