@liveblocks/react-tiptap 3.3.3 → 3.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/dist/LiveblocksExtension.cjs +22 -0
  2. package/dist/LiveblocksExtension.cjs.map +1 -1
  3. package/dist/LiveblocksExtension.js +23 -1
  4. package/dist/LiveblocksExtension.js.map +1 -1
  5. package/dist/comments/CommentsExtension.cjs +114 -0
  6. package/dist/comments/CommentsExtension.cjs.map +1 -1
  7. package/dist/comments/CommentsExtension.js +114 -2
  8. package/dist/comments/CommentsExtension.js.map +1 -1
  9. package/dist/index.d.cts +2 -1
  10. package/dist/index.d.ts +2 -1
  11. package/dist/types.cjs.map +1 -1
  12. package/dist/types.js.map +1 -1
  13. package/dist/version.cjs +1 -1
  14. package/dist/version.js +1 -1
  15. package/package.json +10 -10
  16. package/src/styles/index.css +7 -2
  17. package/styles.css +1 -1
  18. package/styles.css.map +1 -1
package/styles.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["src/styles/src/styles/index.css","src/styles/src/styles/utils.css"],"names":[],"mappings":"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","file":"styles.css","sourcesContent":["@import \"./utils\";\n@import \"./constants\";\n\n/*************************************\n * Suggestions *\n *************************************/\n\n.lb-tiptap-suggestions-list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n/*************************************\n * Mention suggestions *\n *************************************/\n\n.lb-tiptap-mention-suggestions {\n --lb-tiptap-mention-suggestion-avatar-size: 1.25rem;\n}\n\n.lb-tiptap-mention-suggestion {\n padding: calc(0.375 * var(--lb-spacing)) calc(0.625 * var(--lb-spacing));\n}\n\n.lb-tiptap-mention-suggestion-avatar {\n inline-size: var(--lb-tiptap-mention-suggestion-avatar-size);\n margin-inline-start: calc(-0.125 * var(--lb-spacing));\n margin-inline-end: calc(0.5 * var(--lb-spacing));\n margin-block: calc(0.125 * var(--lb-spacing));\n background: var(--lb-foreground-subtle);\n color: var(--lb-foreground-moderate);\n}\n\n/*************************************\n * Elevation lists *\n *************************************/\n\n.lb-tiptap-suggestions {\n padding: $lb-elevation-padding;\n animation-duration: var(--lb-transition-duration);\n animation-timing-function: var(--lb-transition-easing);\n will-change: transform, opacity;\n}\n\n.lb-tiptap-suggestions-list-item {\n display: flex;\n align-items: center;\n padding: calc(0.25 * var(--lb-spacing)) calc(0.5 * var(--lb-spacing));\n border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-padding);\n color: var(--lb-foreground-secondary);\n outline: none;\n font-size: 0.875rem;\n cursor: pointer;\n user-select: none;\n transition-property: background, color, opacity;\n scroll-margin-block: $lb-elevation-padding;\n}\n\n:is(.lb-tiptap-suggestions-list-item) {\n &:where(\n [data-highlighted]:not([data-highlighted=\"false\"]),\n [data-selected]:not([data-selected=\"false\"])\n ) {\n background: var(--lb-foreground-subtle);\n transition-duration: calc(var(--lb-transition-duration) / 2);\n }\n\n &:where(:disabled, [data-disabled]:not([data-disabled=\"false\"])) {\n opacity: 0.5;\n cursor: not-allowed;\n }\n}\n\n/*************************************\n * Floating animations *\n *************************************/\n\n:is(.lb-tiptap-suggestions) {\n &:where([data-side=\"top\"]) {\n animation-name: lb-animation-slide-up;\n }\n\n &:where([data-side=\"bottom\"]) {\n animation-name: lb-animation-slide-down;\n }\n\n &:where([data-state=\"closed\"]) {\n animation-name: lb-animation-disappear;\n }\n}\n\n@media (prefers-reduced-motion) {\n .lb-tiptap-suggestions:where(:not([data-state=\"closed\"])) {\n animation-name: lb-animation-appear;\n }\n}\n\n/*************************************\n * Mention *\n *************************************/\n\n.lb-tiptap-mention {\n padding: 0.1em 0.3em;\n border-radius: calc(0.675 * var(--lb-radius));\n background: var(--lb-accent-subtle);\n color: var(--lb-accent);\n box-decoration-break: clone;\n font-weight: 500;\n\n @include invisible-selection;\n}\n\n.lb-mention-selected {\n background: var(--lb-accent);\n color: var(--lb-accent-foreground);\n}\n\n/*************************************\n * Thread mark *\n *************************************/\n\n:where(.lb-tiptap-thread-mark:not([data-orphan=\"true\"])) {\n background: var(--lb-accent-subtle);\n color: var(--lb-foreground);\n outline: none;\n font-weight: 500;\n transition-property: color, text-decoration-color;\n text-decoration-line: underline;\n text-decoration-color: var(--lb-foreground-moderate);\n text-underline-offset: 2px;\n}\n\n:where(\n .lb-tiptap-thread-mark:not([data-orphan=\"true\"])\n .lb-tiptap-thread-mark-selected\n) {\n color: var(--lb-accent);\n text-decoration-line: underline;\n text-decoration-color: var(--lb-accent-moderate);\n text-underline-offset: 2px;\n}\n\n/*************************************\n * Anchored threads *\n *************************************/\n\n.lb-tiptap-anchored-threads {\n --lb-tiptap-anchored-threads-gap: 1.25rem;\n --lb-tiptap-anchored-threads-active-thread-offset: -0.75rem;\n}\n\n.lb-tiptap-anchored-threads-thread-container {\n transition-duration: calc(var(--lb-transition-duration) * 2);\n transition-property: transform;\n}\n\n@media (prefers-reduced-motion) {\n .lb-tiptap-anchored-threads-thread-container {\n transition-duration: 0s;\n }\n}\n\n.lb-tiptap-anchored-threads-thread {\n position: relative;\n overflow: hidden;\n border-radius: var(--lb-radius);\n background: var(--lb-dynamic-background);\n box-shadow: $lb-tiptap-anchored-threads-shadow;\n transition-property: background, box-shadow;\n\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n z-index: 1;\n border-radius: inherit;\n box-shadow: var(--lb-inset-shadow);\n pointer-events: none;\n }\n\n &:where([data-state=\"active\"]) {\n box-shadow: $lb-tiptap-anchored-threads-active-shadow;\n }\n}\n\n/*************************************\n * Floating components *\n *************************************/\n\n.lb-tiptap-floating {\n --lb-tiptap-floating-size: 350px;\n}\n\n/*************************************\n * Floating threads *\n *************************************/\n\n.lb-tiptap-floating-threads-thread {\n inline-size: var(--lb-tiptap-floating-size);\n\n &:where(:not(:last-of-type)) {\n border-block-end: 1px solid var(--lb-foreground-subtle);\n }\n}\n\n/*************************************\n * Floating composer *\n *************************************/\n\n.lb-tiptap-floating-composer {\n inline-size: var(--lb-tiptap-floating-size);\n}\n\n/*************************************\n * Active selection *\n *************************************/\n\n.lb-tiptap-active-selection {\n background: var(--lb-selection, rgb(0 0 255 / 20%));\n pointer-events: none;\n}\n\n/*************************************\n * Toolbar *\n *************************************/\n\n.lb-tiptap-toolbar {\n --lb-tiptap-toolbar-spacing: calc(0.25 * var(--lb-spacing));\n\n position: relative;\n display: flex;\n flex-direction: row;\n gap: var(--lb-tiptap-toolbar-spacing);\n align-items: center;\n padding: var(--lb-tiptap-toolbar-spacing);\n background: var(--lb-background);\n\n /* overflow-inline: auto; doesn't work as expected */\n /* stylelint-disable-next-line plugin/use-logical-properties-and-values */\n overflow-x: auto;\n\n @include invisible-scrollbar;\n\n > * {\n flex: none;\n }\n}\n\n.lb-tiptap-floating-toolbar {\n --lb-tiptap-toolbar-spacing: $lb-elevation-padding;\n}\n\n.lb-tiptap-toolbar-separator {\n position: relative;\n align-self: stretch;\n inline-size: 1px;\n margin-inline: 1px;\n pointer-events: none;\n\n &::before {\n content: \"\";\n position: absolute;\n inset: 10% 0;\n background: var(--lb-foreground-subtle);\n }\n}\n\n/*************************************\n * AI Toolbar *\n *************************************/\n\n.lb-tiptap-ai-selection {\n background: var(--lb-selection, rgb(0 0 255 / 20%));\n pointer-events: none;\n}\n\n.lb-tiptap-ai-toolbar-portal {\n display: flex;\n flex-direction: column;\n gap: 8px;\n inline-size: var(--lb-tiptap-editor-width);\n outline: none;\n pointer-events: none;\n\n &:where([data-liveblocks-ai-toolbar-flip]) {\n flex-direction: column-reverse;\n }\n}\n\n.lb-tiptap-ai-toolbar-container {\n --lb-tiptap-ai-toolbar-padding: calc(0.5 * var(--lb-spacing));\n --lb-tiptap-ai-toolbar-height: calc(\n $lb-button-size + 2 * var(--lb-tiptap-ai-toolbar-padding)\n );\n\n position: relative;\n min-block-size: var(--lb-tiptap-ai-toolbar-height);\n}\n\n.lb-tiptap-ai-toolbar {\n display: flex;\n flex-direction: column;\n color: var(--lb-foreground);\n pointer-events: auto;\n}\n\n.lb-tiptap-ai-toolbar-response-container,\n.lb-tiptap-ai-toolbar-content {\n max-block-size: calc(6lh + 2 * var(--lb-tiptap-ai-toolbar-padding));\n\n /* overflow-block: auto; doesn't work as expected */\n /* stylelint-disable-next-line plugin/use-logical-properties-and-values */\n overflow-y: auto;\n}\n\n.lb-tiptap-ai-toolbar-content {\n display: grid;\n grid-template-columns: auto 1fr auto;\n inline-size: 100%;\n min-inline-size: 0;\n padding: var(--lb-tiptap-ai-toolbar-padding);\n outline: none;\n}\n\n.lb-tiptap-ai-toolbar-response-container {\n --lb-line-height-crop: calc(1lh - 1em) / -2;\n\n display: flex;\n flex-direction: column;\n padding: calc(var(--lb-spacing) + var(--lb-line-height-crop))\n var(--lb-spacing);\n border-block-end: 1px solid var(--lb-foreground-subtle);\n}\n\n.lb-tiptap-ai-toolbar-response {\n white-space: pre-wrap;\n\n &::before {\n content: \"\\FEFF\";\n display: inline-block;\n vertical-align: middle;\n user-select: none;\n }\n}\n\n.lb-tiptap-ai-toolbar-icon-container,\n.lb-tiptap-ai-toolbar-actions {\n display: flex;\n flex: none;\n block-size: $lb-button-size;\n}\n\n.lb-tiptap-ai-toolbar-icon-container {\n position: sticky;\n inset-block-start: 0;\n align-items: center;\n align-self: start;\n color: var(--lb-foreground-moderate);\n}\n\n.lb-tiptap-ai-toolbar-actions {\n position: sticky;\n inset-block-end: 0;\n gap: var(--lb-tiptap-ai-toolbar-padding);\n align-self: end;\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt {\n all: unset;\n background: transparent;\n color: var(--lb-foreground);\n outline: none;\n resize: none;\n\n &::placeholder {\n color: var(--lb-foreground-moderate);\n }\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt-container {\n position: relative;\n z-index: auto;\n display: grid;\n margin-block: calc(-1 * var(--lb-tiptap-ai-toolbar-padding));\n\n &::before {\n /* The space is important when handling new lines */\n content: attr(data-value) \" \";\n visibility: hidden;\n }\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt,\n.lb-tiptap-ai-toolbar-custom-prompt-container::before {\n /* Overlap the textarea and its value to auto-size it */\n grid-area: 1 / 1 / 2 / 2;\n box-sizing: inherit;\n inline-size: 100%;\n min-inline-size: 0;\n padding: calc(\n var(--lb-tiptap-ai-toolbar-padding) + ($lb-button-size - 1lh) / 2\n )\n var(--lb-tiptap-ai-toolbar-padding);\n font: inherit;\n letter-spacing: inherit;\n white-space: pre-wrap;\n}\n\n.lb-tiptap-ai-toolbar-error {\n --lb-dynamic-background: var(--lb-background-destructive-subtle);\n\n position: relative;\n display: flex;\n gap: calc(0.5 * var(--lb-spacing));\n align-items: center;\n padding: var(--lb-tiptap-ai-toolbar-padding);\n background: var(--lb-dynamic-background);\n color: var(--lb-destructive);\n font-size: 0.875em;\n text-wrap: balance;\n\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n border-block-start: 1px solid var(--lb-destructive-moderate);\n opacity: 0.35;\n pointer-events: none;\n }\n\n :where(.lb-icon-container) {\n color: var(--lb-destructive-secondary);\n }\n}\n\n.lb-tiptap-ai-toolbar-halo {\n --lb-tiptap-ai-toolbar-halo-blur: 16px;\n --lb-tiptap-ai-toolbar-halo-outset: 8px;\n\n position: absolute;\n inset: calc(-1 * var(--lb-tiptap-ai-toolbar-halo-outset));\n z-index: -1;\n overflow: hidden;\n border-radius: calc(\n var(--lb-radius) + var(--lb-tiptap-ai-toolbar-halo-outset)\n );\n filter: blur(var(--lb-tiptap-ai-toolbar-halo-blur));\n pointer-events: none;\n transition-duration: 1s;\n transition-property: opacity;\n animation: lb-animation-ai-toolbar-halo-scale-in 1s\n cubic-bezier(0.165, 0.84, 0.44, 1) both;\n\n &:where(:not([data-active])) {\n opacity: 0.5;\n }\n}\n\n:is(\n .lb-tiptap-ai-toolbar-halo-horizontal,\n .lb-tiptap-ai-toolbar-halo-vertical\n) {\n position: absolute;\n inset: 0;\n\n &::before,\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n opacity: 0.175;\n animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);\n animation-iteration-count: infinite;\n }\n}\n\n.lb-tiptap-ai-toolbar-halo-horizontal {\n &::before {\n inline-size: 200%;\n block-size: 100%;\n background: linear-gradient(\n 30deg,\n transparent 20%,\n var(--lb-accent) 50%,\n transparent 80%\n );\n background-position: top left;\n background-size: 50% 100%;\n animation-name: lb-animation-ai-toolbar-halo-horizontal;\n animation-duration: 8s;\n animation-direction: alternate;\n }\n\n &::after {\n inset-inline-start: -50%;\n inline-size: 400%;\n block-size: 100%;\n background: linear-gradient(\n 90deg,\n transparent 20%,\n var(--lb-accent) 50%,\n transparent 80%\n );\n background-position: top left;\n background-size: 75% 100%;\n animation-name: lb-animation-ai-toolbar-halo-horizontal;\n animation-duration: 6s;\n animation-delay: -2s;\n animation-direction: alternate-reverse;\n }\n}\n\n.lb-tiptap-ai-toolbar-halo-vertical {\n &::before {\n inset-block-start: -50%;\n inline-size: 100%;\n block-size: 400%;\n background: linear-gradient(\n 1deg,\n transparent 40%,\n var(--lb-accent) 50%,\n transparent 60%\n );\n background-position: top left;\n background-size: 100% 600px;\n background-repeat: round;\n animation-name: lb-animation-ai-toolbar-halo-vertical;\n animation-duration: 4s;\n animation-delay: -2s;\n animation-direction: alternate-reverse;\n }\n\n &::after {\n inset-block-start: -50%;\n inline-size: 100%;\n block-size: 400%;\n background: linear-gradient(\n -2deg,\n transparent 40%,\n var(--lb-accent) 50%,\n transparent 60%\n );\n background-position: top left;\n background-size: 100% 400px;\n background-repeat: round;\n animation-name: lb-animation-ai-toolbar-halo-vertical;\n animation-duration: 3s;\n animation-delay: -1s;\n animation-direction: alternate;\n }\n}\n\n.lb-tiptap-ai-toolbar-thinking {\n @include truncate;\n\n align-self: center;\n min-inline-size: 0;\n max-inline-size: fit-content;\n padding-inline: var(--lb-tiptap-ai-toolbar-padding);\n color: var(--lb-foreground-tertiary);\n user-select: none;\n animation: lb-animation-shimmer-small 5s linear infinite;\n}\n\n.lb-tiptap-ai-toolbar-dropdown {\n inline-size: min(250px, 100%);\n pointer-events: auto;\n}\n\n/*************************************\n * Diff Changes *\n *************************************/\n\n.lb-tiptap-change-removed {\n color: color-mix(in srgb, currentcolor 40%, transparent);\n text-decoration: line-through;\n text-decoration-thickness: 1px;\n}\n\n.lb-tiptap-change-added {\n background: color-mix(\n in srgb,\n var(--lb-accent) calc(var(--lb-accent-contrast) * 1.5),\n transparent\n );\n color: var(--lb-accent);\n}\n\n/*************************************\n * Collaboration cursors *\n *************************************/\n\n/* Give a remote user a caret */\n/* stylelint-disable-next-line selector-class-pattern */\n.collaboration-cursor__caret {\n position: relative;\n margin-inline-start: -1px;\n margin-inline-end: -1px;\n border-inline-start: 1px solid #0d0d0d;\n border-inline-end: 1px solid #0d0d0d;\n word-break: normal;\n pointer-events: none;\n}\n\n/* Render the username above the caret */\n/* stylelint-disable-next-line selector-class-pattern */\n.collaboration-cursor__label {\n position: absolute;\n inset-inline-start: -1px;\n inset-block-start: -1.4em;\n padding: 2px 6px;\n border-radius: 6px;\n border-end-start-radius: 0;\n color: #fff;\n font-weight: 600;\n font-style: normal;\n font-size: 14px;\n line-height: normal;\n white-space: nowrap;\n pointer-events: none;\n user-select: none;\n}\n\n/*************************************\n * Animations *\n *************************************/\n\n@keyframes lb-animation-ai-toolbar-halo-scale-in {\n from {\n transform: scale(0.5);\n }\n\n to {\n transform: scale(1);\n }\n}\n\n@keyframes lb-animation-ai-toolbar-halo-horizontal {\n from {\n transform: translateX(-50%);\n }\n\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes lb-animation-ai-toolbar-halo-vertical {\n from {\n transform: translateY(0);\n }\n\n to {\n transform: translateY(-50%);\n }\n}\n","@mixin invisible-selection {\n &::selection,\n *::selection {\n background: transparent;\n }\n}\n\n@mixin invisible-scrollbar {\n & {\n -ms-overflow-style: none;\n scrollbar-width: none;\n }\n\n &::-webkit-scrollbar {\n display: none;\n }\n}\n\n@mixin truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n"]}
1
+ {"version":3,"sources":["src/styles/src/styles/index.css","src/styles/src/styles/utils.css"],"names":[],"mappings":"AAOA,4BAAA,QAAA,CAAA,SAAA,CAAA,eAAA,CAUA,+BAAA,kDAAA,CAIA,8BAAA,gEAAA,CAIA,qCAAA,2DAAA,CAAA,iDAAA,CAAA,4CAAA,CAAA,yCAAA,CAAA,sCAAA,CAAA,mCAAA,CAaA,uBAAA,gDAAA,CAAA,qDAAA,CAAA,6BAAA,CAAA,WAAA,CAOA,iCAAA,6DAAA,CAAA,8CAAA,CAAA,oCAAA,CAAA,cAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,YAAA,CAAA,kBAAA,CAAA,uBAAA,CAAA,iBAAA,CAAA,4CAAA,CAAA,YAAA,CAeE,oIAAA,sCAAA,CAAA,yDAAA,CAQA,6FAAA,UAAA,CAAA,kBAAA,CAWA,8CAAA,oCAAA,CAIA,iDAAA,sCAAA,CAIA,kDAAA,qCAAA,CAeF,mBAAA,yCAAA,CAAA,kCAAA,CAAA,sBAAA,CAAA,kCAAA,CAAA,0BAAA,CAAA,iBAAA,CAAA,eAAA,CCrGE,8BAAA,cAAA,CAAA,+BAAA,cAAA,CDgHF,qBAAA,2BAAA,CAAA,iCAAA,CASA,qEAAA,kCAAA,CAAA,0BAAA,CAAA,8BAAA,CAAA,2DAAA,CAAA,mDAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,eAAA,CAAA,+CAAA,CAWA,qGAAA,sBAAA,CAAA,8BAAA,CAAA,uDAAA,CAAA,+CAAA,CAAA,yBAAA,CAUA,uBAAA,qCAAA,CASA,4BAAA,wCAAA,CAAA,yDAAA,CAKA,6CAAA,yDAAA,CAAA,6BAAA,CAWA,mCAAA,8BAAA,CAAA,uCAAA,CAAA,yCAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,uEAAA,CAQE,yCAAA,UAAA,CAAA,SAAA,CAAA,qBAAA,CAAA,iCAAA,CAAA,mBAAA,CAAA,iBAAA,CAAA,OAAA,CAUA,8DAAA,uEAAA,CASF,oBAAA,+BAAA,CAQA,mCAAA,0CAAA,CAGE,8DAAA,sDAAA,CASF,6BAAA,0CAAA,CAQA,4BAAA,oCAAA,CAAA,mBAAA,CASA,mBAAA,uDAAA,CAAA,oCAAA,CAAA,wCAAA,CAAA,+BAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,kBAAA,CAAA,kBAAA,CAAA,YAAA,CAAA,iBAAA,CAAA,eAAA,CC3NE,sCAAA,YAAA,CD4OA,qBAAA,SAAA,CAKF,4BAAA,+BAAA,CAIA,6BAAA,mBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,iBAAA,CAOE,oCAAA,UAAA,CAAA,sCAAA,CAAA,iBAAA,CAAA,WAAA,CAYF,wBAAA,oCAAA,CAAA,mBAAA,CAKA,6BAAA,yCAAA,CAAA,mBAAA,CAAA,YAAA,CAAA,qBAAA,CAAA,OAAA,CAAA,YAAA,CAQE,sEAAA,6BAAA,CAKF,gCAAA,yDAAA,CAAA,+HAAA,CAAA,iDAAA,CAAA,iBAAA,CAUA,sBAAA,0BAAA,CAAA,mBAAA,CAAA,qBAAA,CAAA,YAAA,CAOA,uEAAA,gEAAA,CAAA,eAAA,CASA,8BAAA,gBAAA,CAAA,iBAAA,CAAA,2CAAA,CAAA,YAAA,CAAA,mCAAA,CAAA,YAAA,CASA,yCAAA,wCAAA,CAAA,6EAAA,CAAA,sDAAA,CAAA,qBAAA,CAAA,YAAA,CAUA,+BAAA,oBAAA,CAGE,sCAAA,WAAA,CAAA,qBAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,oBAAA,CAAA,mEAQF,8DAAA,CAAA,SAAA,CAAA,YAAA,CAAA,qCAOA,mCAAA,CAAA,gBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,8BAQA,uCAAA,CAAA,cAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,oCAOA,SAAA,CAAA,0BAAA,CAAA,WAAA,CAAA,cAAA,CAAA,YAAA,CAAA,iDAOE,mCAAA,CAAA,8CAKF,YAAA,CAAA,yDAAA,CAAA,YAAA,CAAA,iBAAA,CAAA,qDAME,2BAAA,CAAA,iBAAA,CAAA,yFAOF,kBAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,oJAAA,CAAA,YAAA,CAAA,sBAAA,CAAA,oBAAA,CAAA,iBAAA,CAAA,4BAgBA,+DAAA,CAAA,8BAAA,CAAA,2CAAA,CAAA,uCAAA,CAAA,2BAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,gBAAA,CAAA,YAAA,CAAA,iBAAA,CAAA,kCAaE,UAAA,CAAA,2DAAA,CAAA,WAAA,CAAA,mBAAA,CAAA,iBAAA,CAAA,OAAA,CAAA,uDASA,qCAAA,CAAA,2BAKF,qCAAA,CAAA,sCAAA,CAAA,sDAAA,CAAA,UAAA,CAAA,8EAAA,CAAA,kDAAA,CAAA,mBAAA,CAAA,2BAAA,CAAA,sBAAA,CAAA,oFAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,sDAkBE,UAAA,CAAA,+EAKF,iBAAA,CAAA,OAAA,CAAA,2KAOE,UAAA,CAAA,YAAA,CAAA,0DAAA,CAAA,kCAAA,CAAA,iBAAA,CAAA,OAAA,CAAA,6CAYA,qFAAA,CAAA,uBAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,sDAAA,CAAA,qBAAA,CAAA,6BAAA,CAAA,4CAgBA,qFAAA,CAAA,uBAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,sDAAA,CAAA,qBAAA,CAAA,qCAAA,CAAA,mBAAA,CAAA,uBAAA,CAAA,2CAoBA,oFAAA,CAAA,uBAAA,CAAA,uBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,oDAAA,CAAA,qBAAA,CAAA,qCAAA,CAAA,mBAAA,CAAA,sBAAA,CAAA,0CAmBA,qFAAA,CAAA,uBAAA,CAAA,uBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,oDAAA,CAAA,qBAAA,CAAA,6BAAA,CAAA,mBAAA,CAAA,sBAAA,CAAA,+BAoBF,sBAAA,CAAA,kBAAA,CAAA,iBAAA,CAAA,2BAAA,CAAA,kDAAA,CAAA,mCAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,uDAAA,CAAA,eAAA,CAAA,+BAYA,mBAAA,CAAA,2BAAA,CAAA,0BASA,qDAAA,CAAA,4BAAA,CAAA,6BAAA,CAAA,wBAMA,6FAAA,CAAA,sBAAA,CAAA,6BAeA,iBAAA,CAAA,mBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,iBAAA,CAAA,6BAYA,iBAAA,CAAA,UAAA,CAAA,kBAAA,CAAA,mBAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,yBAAA,CAAA,eAAA,CAAA,cAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,kBAAA,CAAA,iBAAA,CAAA,wBAAA,CAAA,uBAAA,CAAA,iDAqBA,GAAA,mBAAA,CAAA,GAAA,kBAAA,CAAA,CAAA,mDAUA,GAAA,yBAAA,CAAA,GAAA,sBAAA,CAAA,CAAA,iDAUA,GAAA,uBAAA,CAAA,GAAA,0BAAA,CAAA,CAAA,gCAjjBA,wDACE,kCAAA,CAAA,6CAsEA,sBAAA,CAAA","file":"styles.css","sourcesContent":["@import \"./utils\";\n@import \"./constants\";\n\n/*************************************\n * Suggestions *\n *************************************/\n\n.lb-tiptap-suggestions-list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n/*************************************\n * Mention suggestions *\n *************************************/\n\n.lb-tiptap-mention-suggestions {\n --lb-tiptap-mention-suggestion-avatar-size: 1.25rem;\n}\n\n.lb-tiptap-mention-suggestion {\n padding: calc(0.375 * var(--lb-spacing)) calc(0.625 * var(--lb-spacing));\n}\n\n.lb-tiptap-mention-suggestion-avatar {\n inline-size: var(--lb-tiptap-mention-suggestion-avatar-size);\n margin-inline-start: calc(-0.125 * var(--lb-spacing));\n margin-inline-end: calc(0.5 * var(--lb-spacing));\n margin-block: calc(0.125 * var(--lb-spacing));\n background: var(--lb-foreground-subtle);\n color: var(--lb-foreground-moderate);\n}\n\n/*************************************\n * Elevation lists *\n *************************************/\n\n.lb-tiptap-suggestions {\n padding: $lb-elevation-padding;\n animation-duration: var(--lb-transition-duration);\n animation-timing-function: var(--lb-transition-easing);\n will-change: transform, opacity;\n}\n\n.lb-tiptap-suggestions-list-item {\n display: flex;\n align-items: center;\n padding: calc(0.25 * var(--lb-spacing)) calc(0.5 * var(--lb-spacing));\n border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-padding);\n color: var(--lb-foreground-secondary);\n outline: none;\n font-size: 0.875rem;\n cursor: pointer;\n user-select: none;\n transition-property: background, color, opacity;\n scroll-margin-block: $lb-elevation-padding;\n}\n\n:is(.lb-tiptap-suggestions-list-item) {\n &:where(\n [data-highlighted]:not([data-highlighted=\"false\"]),\n [data-selected]:not([data-selected=\"false\"])\n ) {\n background: var(--lb-foreground-subtle);\n transition-duration: calc(var(--lb-transition-duration) / 2);\n }\n\n &:where(:disabled, [data-disabled]:not([data-disabled=\"false\"])) {\n opacity: 0.5;\n cursor: not-allowed;\n }\n}\n\n/*************************************\n * Floating animations *\n *************************************/\n\n:is(.lb-tiptap-suggestions) {\n &:where([data-side=\"top\"]) {\n animation-name: lb-animation-slide-up;\n }\n\n &:where([data-side=\"bottom\"]) {\n animation-name: lb-animation-slide-down;\n }\n\n &:where([data-state=\"closed\"]) {\n animation-name: lb-animation-disappear;\n }\n}\n\n@media (prefers-reduced-motion) {\n .lb-tiptap-suggestions:where(:not([data-state=\"closed\"])) {\n animation-name: lb-animation-appear;\n }\n}\n\n/*************************************\n * Mention *\n *************************************/\n\n.lb-tiptap-mention {\n padding: 0.1em 0.3em;\n border-radius: calc(0.675 * var(--lb-radius));\n background: var(--lb-accent-subtle);\n color: var(--lb-accent);\n box-decoration-break: clone;\n font-weight: 500;\n\n @include invisible-selection;\n}\n\n.lb-mention-selected {\n background: var(--lb-accent);\n color: var(--lb-accent-foreground);\n}\n\n/*************************************\n * Thread mark *\n *************************************/\n\n:where(.lb-tiptap-thread-mark:not([data-orphan=\"true\"], [data-hidden])) {\n background: var(--lb-accent-subtle);\n color: var(--lb-foreground);\n outline: none;\n font-weight: 500;\n transition-property: color, text-decoration-color;\n text-decoration-line: underline;\n text-decoration-color: var(--lb-foreground-moderate);\n text-underline-offset: 2px;\n}\n\n:where(\n .lb-tiptap-thread-mark:not([data-orphan=\"true\"], [data-hidden])\n .lb-tiptap-thread-mark-selected\n) {\n color: var(--lb-accent);\n text-decoration-line: underline;\n text-decoration-color: var(--lb-accent-moderate);\n text-underline-offset: 2px;\n}\n\n.lb-tiptap-thread-mark {\n /* Add some space above/below when scrolling to it. */\n scroll-margin-block: var(--lb-spacing);\n}\n\n/*************************************\n * Anchored threads *\n *************************************/\n\n.lb-tiptap-anchored-threads {\n --lb-tiptap-anchored-threads-gap: 1.25rem;\n --lb-tiptap-anchored-threads-active-thread-offset: -0.75rem;\n}\n\n.lb-tiptap-anchored-threads-thread-container {\n transition-duration: calc(var(--lb-transition-duration) * 2);\n transition-property: transform;\n}\n\n@media (prefers-reduced-motion) {\n .lb-tiptap-anchored-threads-thread-container {\n transition-duration: 0s;\n }\n}\n\n.lb-tiptap-anchored-threads-thread {\n position: relative;\n overflow: hidden;\n border-radius: var(--lb-radius);\n background: var(--lb-dynamic-background);\n box-shadow: $lb-tiptap-anchored-threads-shadow;\n transition-property: background, box-shadow;\n\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n z-index: 1;\n border-radius: inherit;\n box-shadow: var(--lb-inset-shadow);\n pointer-events: none;\n }\n\n &:where([data-state=\"active\"]) {\n box-shadow: $lb-tiptap-anchored-threads-active-shadow;\n }\n}\n\n/*************************************\n * Floating components *\n *************************************/\n\n.lb-tiptap-floating {\n --lb-tiptap-floating-size: 350px;\n}\n\n/*************************************\n * Floating threads *\n *************************************/\n\n.lb-tiptap-floating-threads-thread {\n inline-size: var(--lb-tiptap-floating-size);\n\n &:where(:not(:last-of-type)) {\n border-block-end: 1px solid var(--lb-foreground-subtle);\n }\n}\n\n/*************************************\n * Floating composer *\n *************************************/\n\n.lb-tiptap-floating-composer {\n inline-size: var(--lb-tiptap-floating-size);\n}\n\n/*************************************\n * Active selection *\n *************************************/\n\n.lb-tiptap-active-selection {\n background: var(--lb-selection, rgb(0 0 255 / 20%));\n pointer-events: none;\n}\n\n/*************************************\n * Toolbar *\n *************************************/\n\n.lb-tiptap-toolbar {\n --lb-tiptap-toolbar-spacing: calc(0.25 * var(--lb-spacing));\n\n position: relative;\n display: flex;\n flex-direction: row;\n gap: var(--lb-tiptap-toolbar-spacing);\n align-items: center;\n padding: var(--lb-tiptap-toolbar-spacing);\n background: var(--lb-background);\n\n /* overflow-inline: auto; doesn't work as expected */\n /* stylelint-disable-next-line plugin/use-logical-properties-and-values */\n overflow-x: auto;\n\n @include invisible-scrollbar;\n\n > * {\n flex: none;\n }\n}\n\n.lb-tiptap-floating-toolbar {\n --lb-tiptap-toolbar-spacing: $lb-elevation-padding;\n}\n\n.lb-tiptap-toolbar-separator {\n position: relative;\n align-self: stretch;\n inline-size: 1px;\n margin-inline: 1px;\n pointer-events: none;\n\n &::before {\n content: \"\";\n position: absolute;\n inset: 10% 0;\n background: var(--lb-foreground-subtle);\n }\n}\n\n/*************************************\n * AI Toolbar *\n *************************************/\n\n.lb-tiptap-ai-selection {\n background: var(--lb-selection, rgb(0 0 255 / 20%));\n pointer-events: none;\n}\n\n.lb-tiptap-ai-toolbar-portal {\n display: flex;\n flex-direction: column;\n gap: 8px;\n inline-size: var(--lb-tiptap-editor-width);\n outline: none;\n pointer-events: none;\n\n &:where([data-liveblocks-ai-toolbar-flip]) {\n flex-direction: column-reverse;\n }\n}\n\n.lb-tiptap-ai-toolbar-container {\n --lb-tiptap-ai-toolbar-padding: calc(0.5 * var(--lb-spacing));\n --lb-tiptap-ai-toolbar-height: calc(\n $lb-button-size + 2 * var(--lb-tiptap-ai-toolbar-padding)\n );\n\n position: relative;\n min-block-size: var(--lb-tiptap-ai-toolbar-height);\n}\n\n.lb-tiptap-ai-toolbar {\n display: flex;\n flex-direction: column;\n color: var(--lb-foreground);\n pointer-events: auto;\n}\n\n.lb-tiptap-ai-toolbar-response-container,\n.lb-tiptap-ai-toolbar-content {\n max-block-size: calc(6lh + 2 * var(--lb-tiptap-ai-toolbar-padding));\n\n /* overflow-block: auto; doesn't work as expected */\n /* stylelint-disable-next-line plugin/use-logical-properties-and-values */\n overflow-y: auto;\n}\n\n.lb-tiptap-ai-toolbar-content {\n display: grid;\n grid-template-columns: auto 1fr auto;\n inline-size: 100%;\n min-inline-size: 0;\n padding: var(--lb-tiptap-ai-toolbar-padding);\n outline: none;\n}\n\n.lb-tiptap-ai-toolbar-response-container {\n --lb-line-height-crop: calc(1lh - 1em) / -2;\n\n display: flex;\n flex-direction: column;\n padding: calc(var(--lb-spacing) + var(--lb-line-height-crop))\n var(--lb-spacing);\n border-block-end: 1px solid var(--lb-foreground-subtle);\n}\n\n.lb-tiptap-ai-toolbar-response {\n white-space: pre-wrap;\n\n &::before {\n content: \"\\FEFF\";\n display: inline-block;\n vertical-align: middle;\n user-select: none;\n }\n}\n\n.lb-tiptap-ai-toolbar-icon-container,\n.lb-tiptap-ai-toolbar-actions {\n display: flex;\n flex: none;\n block-size: $lb-button-size;\n}\n\n.lb-tiptap-ai-toolbar-icon-container {\n position: sticky;\n inset-block-start: 0;\n align-items: center;\n align-self: start;\n color: var(--lb-foreground-moderate);\n}\n\n.lb-tiptap-ai-toolbar-actions {\n position: sticky;\n inset-block-end: 0;\n gap: var(--lb-tiptap-ai-toolbar-padding);\n align-self: end;\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt {\n all: unset;\n background: transparent;\n color: var(--lb-foreground);\n outline: none;\n resize: none;\n\n &::placeholder {\n color: var(--lb-foreground-moderate);\n }\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt-container {\n position: relative;\n z-index: auto;\n display: grid;\n margin-block: calc(-1 * var(--lb-tiptap-ai-toolbar-padding));\n\n &::before {\n /* The space is important when handling new lines */\n content: attr(data-value) \" \";\n visibility: hidden;\n }\n}\n\n.lb-tiptap-ai-toolbar-custom-prompt,\n.lb-tiptap-ai-toolbar-custom-prompt-container::before {\n /* Overlap the textarea and its value to auto-size it */\n grid-area: 1 / 1 / 2 / 2;\n box-sizing: inherit;\n inline-size: 100%;\n min-inline-size: 0;\n padding: calc(\n var(--lb-tiptap-ai-toolbar-padding) + ($lb-button-size - 1lh) / 2\n )\n var(--lb-tiptap-ai-toolbar-padding);\n font: inherit;\n letter-spacing: inherit;\n white-space: pre-wrap;\n}\n\n.lb-tiptap-ai-toolbar-error {\n --lb-dynamic-background: var(--lb-background-destructive-subtle);\n\n position: relative;\n display: flex;\n gap: calc(0.5 * var(--lb-spacing));\n align-items: center;\n padding: var(--lb-tiptap-ai-toolbar-padding);\n background: var(--lb-dynamic-background);\n color: var(--lb-destructive);\n font-size: 0.875em;\n text-wrap: balance;\n\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n border-block-start: 1px solid var(--lb-destructive-moderate);\n opacity: 0.35;\n pointer-events: none;\n }\n\n :where(.lb-icon-container) {\n color: var(--lb-destructive-secondary);\n }\n}\n\n.lb-tiptap-ai-toolbar-halo {\n --lb-tiptap-ai-toolbar-halo-blur: 16px;\n --lb-tiptap-ai-toolbar-halo-outset: 8px;\n\n position: absolute;\n inset: calc(-1 * var(--lb-tiptap-ai-toolbar-halo-outset));\n z-index: -1;\n overflow: hidden;\n border-radius: calc(\n var(--lb-radius) + var(--lb-tiptap-ai-toolbar-halo-outset)\n );\n filter: blur(var(--lb-tiptap-ai-toolbar-halo-blur));\n pointer-events: none;\n transition-duration: 1s;\n transition-property: opacity;\n animation: lb-animation-ai-toolbar-halo-scale-in 1s\n cubic-bezier(0.165, 0.84, 0.44, 1) both;\n\n &:where(:not([data-active])) {\n opacity: 0.5;\n }\n}\n\n:is(\n .lb-tiptap-ai-toolbar-halo-horizontal,\n .lb-tiptap-ai-toolbar-halo-vertical\n) {\n position: absolute;\n inset: 0;\n\n &::before,\n &::after {\n content: \"\";\n position: absolute;\n inset: 0;\n opacity: 0.175;\n animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);\n animation-iteration-count: infinite;\n }\n}\n\n.lb-tiptap-ai-toolbar-halo-horizontal {\n &::before {\n inline-size: 200%;\n block-size: 100%;\n background: linear-gradient(\n 30deg,\n transparent 20%,\n var(--lb-accent) 50%,\n transparent 80%\n );\n background-position: top left;\n background-size: 50% 100%;\n animation-name: lb-animation-ai-toolbar-halo-horizontal;\n animation-duration: 8s;\n animation-direction: alternate;\n }\n\n &::after {\n inset-inline-start: -50%;\n inline-size: 400%;\n block-size: 100%;\n background: linear-gradient(\n 90deg,\n transparent 20%,\n var(--lb-accent) 50%,\n transparent 80%\n );\n background-position: top left;\n background-size: 75% 100%;\n animation-name: lb-animation-ai-toolbar-halo-horizontal;\n animation-duration: 6s;\n animation-delay: -2s;\n animation-direction: alternate-reverse;\n }\n}\n\n.lb-tiptap-ai-toolbar-halo-vertical {\n &::before {\n inset-block-start: -50%;\n inline-size: 100%;\n block-size: 400%;\n background: linear-gradient(\n 1deg,\n transparent 40%,\n var(--lb-accent) 50%,\n transparent 60%\n );\n background-position: top left;\n background-size: 100% 600px;\n background-repeat: round;\n animation-name: lb-animation-ai-toolbar-halo-vertical;\n animation-duration: 4s;\n animation-delay: -2s;\n animation-direction: alternate-reverse;\n }\n\n &::after {\n inset-block-start: -50%;\n inline-size: 100%;\n block-size: 400%;\n background: linear-gradient(\n -2deg,\n transparent 40%,\n var(--lb-accent) 50%,\n transparent 60%\n );\n background-position: top left;\n background-size: 100% 400px;\n background-repeat: round;\n animation-name: lb-animation-ai-toolbar-halo-vertical;\n animation-duration: 3s;\n animation-delay: -1s;\n animation-direction: alternate;\n }\n}\n\n.lb-tiptap-ai-toolbar-thinking {\n @include truncate;\n\n align-self: center;\n min-inline-size: 0;\n max-inline-size: fit-content;\n padding-inline: var(--lb-tiptap-ai-toolbar-padding);\n color: var(--lb-foreground-tertiary);\n user-select: none;\n animation: lb-animation-shimmer-small 5s linear infinite;\n}\n\n.lb-tiptap-ai-toolbar-dropdown {\n inline-size: min(250px, 100%);\n pointer-events: auto;\n}\n\n/*************************************\n * Diff Changes *\n *************************************/\n\n.lb-tiptap-change-removed {\n color: color-mix(in srgb, currentcolor 40%, transparent);\n text-decoration: line-through;\n text-decoration-thickness: 1px;\n}\n\n.lb-tiptap-change-added {\n background: color-mix(\n in srgb,\n var(--lb-accent) calc(var(--lb-accent-contrast) * 1.5),\n transparent\n );\n color: var(--lb-accent);\n}\n\n/*************************************\n * Collaboration cursors *\n *************************************/\n\n/* Give a remote user a caret */\n/* stylelint-disable-next-line selector-class-pattern */\n.collaboration-cursor__caret {\n position: relative;\n margin-inline-start: -1px;\n margin-inline-end: -1px;\n border-inline-start: 1px solid #0d0d0d;\n border-inline-end: 1px solid #0d0d0d;\n word-break: normal;\n pointer-events: none;\n}\n\n/* Render the username above the caret */\n/* stylelint-disable-next-line selector-class-pattern */\n.collaboration-cursor__label {\n position: absolute;\n inset-inline-start: -1px;\n inset-block-start: -1.4em;\n padding: 2px 6px;\n border-radius: 6px;\n border-end-start-radius: 0;\n color: #fff;\n font-weight: 600;\n font-style: normal;\n font-size: 14px;\n line-height: normal;\n white-space: nowrap;\n pointer-events: none;\n user-select: none;\n}\n\n/*************************************\n * Animations *\n *************************************/\n\n@keyframes lb-animation-ai-toolbar-halo-scale-in {\n from {\n transform: scale(0.5);\n }\n\n to {\n transform: scale(1);\n }\n}\n\n@keyframes lb-animation-ai-toolbar-halo-horizontal {\n from {\n transform: translateX(-50%);\n }\n\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes lb-animation-ai-toolbar-halo-vertical {\n from {\n transform: translateY(0);\n }\n\n to {\n transform: translateY(-50%);\n }\n}\n","@mixin invisible-selection {\n &::selection,\n *::selection {\n background: transparent;\n }\n}\n\n@mixin invisible-scrollbar {\n & {\n -ms-overflow-style: none;\n scrollbar-width: none;\n }\n\n &::-webkit-scrollbar {\n display: none;\n }\n}\n\n@mixin truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n"]}