@liveblocks/react-tiptap 2.16.1-ai5 → 2.16.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/LiveblocksExtension.js +21 -116
- package/dist/LiveblocksExtension.js.map +1 -1
- package/dist/LiveblocksExtension.mjs +19 -114
- package/dist/LiveblocksExtension.mjs.map +1 -1
- package/dist/comments/CommentsExtension.js.map +1 -1
- package/dist/comments/CommentsExtension.mjs.map +1 -1
- package/dist/comments/FloatingComposer.js +2 -2
- package/dist/comments/FloatingComposer.js.map +1 -1
- package/dist/comments/FloatingComposer.mjs +2 -2
- package/dist/comments/FloatingComposer.mjs.map +1 -1
- package/dist/index.d.mts +15 -107
- package/dist/index.d.ts +15 -107
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +0 -1
- package/dist/index.mjs.map +1 -1
- package/dist/toolbar/FloatingToolbar.js +0 -7
- package/dist/toolbar/FloatingToolbar.js.map +1 -1
- package/dist/toolbar/FloatingToolbar.mjs +0 -7
- package/dist/toolbar/FloatingToolbar.mjs.map +1 -1
- package/dist/toolbar/Toolbar.js +1 -35
- package/dist/toolbar/Toolbar.js.map +1 -1
- package/dist/toolbar/Toolbar.mjs +2 -36
- package/dist/toolbar/Toolbar.mjs.map +1 -1
- package/dist/types.js.map +1 -1
- package/dist/types.mjs.map +1 -1
- package/dist/utils.js +6 -118
- package/dist/utils.js.map +1 -1
- package/dist/utils.mjs +7 -116
- package/dist/utils.mjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.js.map +1 -1
- package/dist/version.mjs +1 -1
- package/dist/version.mjs.map +1 -1
- package/package.json +6 -7
- package/src/styles/index.css +3 -380
- package/src/styles/utils.css +0 -6
- package/styles.css +1 -1
- package/styles.css.map +1 -1
- package/dist/ai/AiExtension.js +0 -382
- package/dist/ai/AiExtension.js.map +0 -1
- package/dist/ai/AiExtension.mjs +0 -378
- package/dist/ai/AiExtension.mjs.map +0 -1
- package/dist/ai/AiToolbar.js +0 -663
- package/dist/ai/AiToolbar.js.map +0 -1
- package/dist/ai/AiToolbar.mjs +0 -660
- package/dist/ai/AiToolbar.mjs.map +0 -1
package/dist/utils.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.mjs","sources":["../src/utils.ts"],"sourcesContent":["import type { ClientRectObject } from \"@floating-ui/react-dom\";\nimport type { ContextualPromptContext } from \"@liveblocks/core\";\nimport type { Editor, Range } from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Fragment } from \"@tiptap/pm/model\";\nimport {\n type EditorState,\n type Selection,\n TextSelection,\n} from \"@tiptap/pm/state\";\nimport {\n getRelativeSelection,\n relativePositionToAbsolutePosition,\n ySyncPluginKey,\n} from \"y-prosemirror\";\nimport type { RelativePosition } from \"yjs\";\n\nimport type { YSyncPluginState } from \"./types\";\nimport { LIVEBLOCKS_MENTION_TYPE } from \"./types\";\n\nconst CONTEXT_TRUNCATION = \"[…]\";\nconst CONTEXT_BLOCK_SEPARATOR = \"\\n\";\n\nexport const getRelativeSelectionFromState = (state: EditorState) => {\n const pluginState = ySyncPluginKey.getState(state) as YSyncPluginState;\n if (!pluginState) return null;\n return getRelativeSelection(pluginState.binding, state);\n};\n\nexport const getRangeFromRelativeSelections = (\n pos: { anchor: RelativePosition; head: RelativePosition },\n state: EditorState\n) => {\n const pluginState = ySyncPluginKey.getState(state) as YSyncPluginState;\n if (!pluginState || !pluginState.binding) return { from: 0, to: 0 };\n const { doc, type, mapping } = pluginState.binding;\n const anchor =\n relativePositionToAbsolutePosition(doc, type, pos.anchor, mapping) ?? 0;\n const head =\n relativePositionToAbsolutePosition(doc, type, pos.head, mapping) ?? 0;\n\n const from = anchor > head ? head : anchor;\n const to = anchor > head ? anchor : head;\n return { from, to };\n};\n\nexport const getRectFromCoords = (coords: {\n top: number;\n left: number;\n right: number;\n bottom: number;\n}): ClientRectObject => {\n return {\n ...coords,\n x: coords.left,\n y: coords.top,\n width: coords.right - coords.left,\n height: coords.bottom - coords.top,\n };\n};\n\nexport const getMentionsFromNode = (\n node: ProseMirrorNode,\n range: Range\n): { notificationId: string; userId: string }[] => {\n const result: { notificationId: string; userId: string }[] = [];\n node.nodesBetween(range.from, range.to, (child) => {\n if (child.type.name === LIVEBLOCKS_MENTION_TYPE) {\n const mention = child.attrs as { id?: string; notificationId?: string };\n if (mention.id && mention.notificationId) {\n result.push({\n notificationId: mention.notificationId,\n userId: mention.id,\n });\n }\n }\n });\n return result;\n};\n\n// How to modify data in transformPasted, inspired by: https://discuss.prosemirror.net/t/modify-specific-node-on-copy-and-paste-in-clipboard/4901/4\nexport const mapFragment = (\n fragment: Fragment,\n callback: (\n node: ProseMirrorNode\n ) => ProseMirrorNode | ProseMirrorNode[] | Fragment | null\n): Fragment => {\n const content: ProseMirrorNode[] = [];\n fragment.forEach((node) => {\n if (node.content.childCount > 0) {\n content.push(\n node.type.create(node.attrs, mapFragment(node.content, callback))\n );\n return;\n }\n content.push(callback(node) as ProseMirrorNode);\n });\n\n return Fragment.from(content);\n};\n\nexport function getDomRangeFromSelection(editor: Editor, selection: Selection) {\n if (selection.from === selection.to) {\n const { parent, parentOffset } = selection.$from;\n\n // If the selection is collapsed and in an empty block node or at the end\n // of a text node, extend it to the entire node\n if (\n (parent.isBlock && parent.content.size === 0) ||\n (parent.isTextblock && parentOffset === parent.content.size)\n ) {\n selection = TextSelection.create(\n editor.state.doc,\n selection.$from.before(),\n selection.$from.after()\n );\n }\n }\n\n const from = editor.view.domAtPos(selection.from);\n const to = editor.view.domAtPos(selection.to);\n\n const domRange = document.createRange();\n domRange.setStart(from.node, from.offset);\n domRange.setEnd(to.node, to.offset);\n\n return domRange;\n}\n\nexport function compareSelections(\n a: Selection | null | undefined,\n b: Selection | null | undefined\n) {\n if (!a || !b) {\n return false;\n }\n\n return a.eq(b);\n}\n\nexport function getContextualPromptContext(\n editor: Editor,\n maxLength = 10_000\n): ContextualPromptContext {\n const { selection, doc } = editor.state;\n\n const selectionLength = selection.to - selection.from;\n\n if (maxLength >= doc.content.size) {\n // If the document is smaller than the maximum length, return the entire document\n return {\n beforeSelection: doc.textBetween(\n 0,\n selection.from,\n CONTEXT_BLOCK_SEPARATOR\n ),\n selection: doc.textBetween(\n selection.from,\n selection.to,\n CONTEXT_BLOCK_SEPARATOR\n ),\n afterSelection: doc.textBetween(\n selection.to,\n doc.content.size,\n CONTEXT_BLOCK_SEPARATOR\n ),\n };\n } else if (selectionLength > maxLength) {\n // If the selection is too large, truncate its middle to still allow continuations\n const selectionStart = doc.textBetween(\n selection.from,\n selection.from + Math.floor(maxLength / 2) - CONTEXT_TRUNCATION.length,\n CONTEXT_BLOCK_SEPARATOR\n );\n const selectionEnd = doc.textBetween(\n selection.to - Math.floor(maxLength / 2) + CONTEXT_TRUNCATION.length,\n selection.to,\n CONTEXT_BLOCK_SEPARATOR\n );\n\n return {\n beforeSelection: \"\",\n selection: `${selectionStart}${CONTEXT_TRUNCATION}${selectionEnd}`,\n afterSelection: \"\",\n };\n } else {\n // If the selection is smaller than (or equal to) the maximum length, extract as much as possible from the document around the selection\n\n // Start by taking as much as possible after the selection\n let beforeLength = Math.min(\n selection.from,\n Math.floor((maxLength - selectionLength) / 2)\n );\n const afterLength = Math.min(\n doc.content.size - selection.to,\n maxLength - selectionLength - beforeLength\n );\n\n // If needed (e.g. the selection is near the end), compensate before the selection\n if (beforeLength + afterLength + selectionLength < maxLength) {\n beforeLength = Math.min(\n selection.from,\n maxLength - selectionLength - afterLength\n );\n }\n\n let beforeSelection = doc.textBetween(\n Math.max(0, selection.from - beforeLength),\n selection.from,\n CONTEXT_BLOCK_SEPARATOR\n );\n let afterSelection = doc.textBetween(\n selection.to,\n Math.min(doc.content.size, selection.to + afterLength),\n CONTEXT_BLOCK_SEPARATOR\n );\n\n // Add leading truncation if `beforeSelection` doesn't contain the document's start\n if (selection.from - beforeLength > 0) {\n beforeSelection = `${CONTEXT_TRUNCATION}${beforeSelection}`;\n }\n\n // Add trailing truncation if `afterSelection` doesn't contain the document's end\n if (selection.to + afterLength < doc.content.size) {\n afterSelection = `${afterSelection}${CONTEXT_TRUNCATION}`;\n }\n\n return {\n beforeSelection,\n selection: doc.textBetween(\n selection.from,\n selection.to,\n CONTEXT_BLOCK_SEPARATOR\n ),\n afterSelection,\n };\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.mjs","sources":["../src/utils.ts"],"sourcesContent":["import type { ClientRectObject } from \"@floating-ui/react-dom\";\nimport type { Editor, Range } from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Fragment } from \"@tiptap/pm/model\";\nimport type { Selection } from \"@tiptap/pm/state\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"./types\";\n\nexport const getRectFromCoords = (coords: {\n top: number;\n left: number;\n right: number;\n bottom: number;\n}): ClientRectObject => {\n return {\n ...coords,\n x: coords.left,\n y: coords.top,\n width: coords.right - coords.left,\n height: coords.bottom - coords.top,\n };\n};\n\nexport const getMentionsFromNode = (\n node: ProseMirrorNode,\n range: Range\n): { notificationId: string; userId: string }[] => {\n const result: { notificationId: string; userId: string }[] = [];\n node.nodesBetween(range.from, range.to, (child) => {\n if (child.type.name === LIVEBLOCKS_MENTION_TYPE) {\n const mention = child.attrs as { id?: string; notificationId?: string };\n if (mention.id && mention.notificationId) {\n result.push({\n notificationId: mention.notificationId,\n userId: mention.id,\n });\n }\n }\n });\n return result;\n};\n\n// How to modify data in transformPasted, inspired by: https://discuss.prosemirror.net/t/modify-specific-node-on-copy-and-paste-in-clipboard/4901/4\nexport const mapFragment = (\n fragment: Fragment,\n callback: (\n node: ProseMirrorNode\n ) => ProseMirrorNode | ProseMirrorNode[] | Fragment | null\n): Fragment => {\n const content: ProseMirrorNode[] = [];\n fragment.forEach((node) => {\n if (node.content.childCount > 0) {\n content.push(\n node.type.create(node.attrs, mapFragment(node.content, callback))\n );\n return;\n }\n content.push(callback(node) as ProseMirrorNode);\n });\n\n return Fragment.from(content);\n};\n\nexport function getDomRangeFromSelection(selection: Selection, editor: Editor) {\n const { from, to } = selection;\n const fromPos = editor.view.domAtPos(from);\n const endPos = editor.view.domAtPos(to);\n\n const domRange = document.createRange();\n domRange.setStart(fromPos.node, fromPos.offset);\n domRange.setEnd(endPos.node, endPos.offset);\n\n return domRange;\n}\n\nexport function compareSelections(\n a: Selection | null | undefined,\n b: Selection | null | undefined\n) {\n if (!a || !b) {\n return false;\n }\n\n return a.eq(b);\n}\n"],"names":[],"mappings":";;;AAQa,MAAA,iBAAA,GAAoB,CAAC,MAKV,KAAA;AACtB,EAAO,OAAA;AAAA,IACL,GAAG,MAAA;AAAA,IACH,GAAG,MAAO,CAAA,IAAA;AAAA,IACV,GAAG,MAAO,CAAA,GAAA;AAAA,IACV,KAAA,EAAO,MAAO,CAAA,KAAA,GAAQ,MAAO,CAAA,IAAA;AAAA,IAC7B,MAAA,EAAQ,MAAO,CAAA,MAAA,GAAS,MAAO,CAAA,GAAA;AAAA,GACjC,CAAA;AACF,EAAA;AAEa,MAAA,mBAAA,GAAsB,CACjC,IAAA,EACA,KACiD,KAAA;AACjD,EAAA,MAAM,SAAuD,EAAC,CAAA;AAC9D,EAAA,IAAA,CAAK,aAAa,KAAM,CAAA,IAAA,EAAM,KAAM,CAAA,EAAA,EAAI,CAAC,KAAU,KAAA;AACjD,IAAI,IAAA,KAAA,CAAM,IAAK,CAAA,IAAA,KAAS,uBAAyB,EAAA;AAC/C,MAAA,MAAM,UAAU,KAAM,CAAA,KAAA,CAAA;AACtB,MAAI,IAAA,OAAA,CAAQ,EAAM,IAAA,OAAA,CAAQ,cAAgB,EAAA;AACxC,QAAA,MAAA,CAAO,IAAK,CAAA;AAAA,UACV,gBAAgB,OAAQ,CAAA,cAAA;AAAA,UACxB,QAAQ,OAAQ,CAAA,EAAA;AAAA,SACjB,CAAA,CAAA;AAAA,OACH;AAAA,KACF;AAAA,GACD,CAAA,CAAA;AACD,EAAO,OAAA,MAAA,CAAA;AACT,EAAA;AAGa,MAAA,WAAA,GAAc,CACzB,QAAA,EACA,QAGa,KAAA;AACb,EAAA,MAAM,UAA6B,EAAC,CAAA;AACpC,EAAS,QAAA,CAAA,OAAA,CAAQ,CAAC,IAAS,KAAA;AACzB,IAAI,IAAA,IAAA,CAAK,OAAQ,CAAA,UAAA,GAAa,CAAG,EAAA;AAC/B,MAAQ,OAAA,CAAA,IAAA;AAAA,QACN,IAAA,CAAK,KAAK,MAAO,CAAA,IAAA,CAAK,OAAO,WAAY,CAAA,IAAA,CAAK,OAAS,EAAA,QAAQ,CAAC,CAAA;AAAA,OAClE,CAAA;AACA,MAAA,OAAA;AAAA,KACF;AACA,IAAQ,OAAA,CAAA,IAAA,CAAK,QAAS,CAAA,IAAI,CAAoB,CAAA,CAAA;AAAA,GAC/C,CAAA,CAAA;AAED,EAAO,OAAA,QAAA,CAAS,KAAK,OAAO,CAAA,CAAA;AAC9B,EAAA;AAEgB,SAAA,wBAAA,CAAyB,WAAsB,MAAgB,EAAA;AAC7E,EAAM,MAAA,EAAE,IAAM,EAAA,EAAA,EAAO,GAAA,SAAA,CAAA;AACrB,EAAA,MAAM,OAAU,GAAA,MAAA,CAAO,IAAK,CAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AACzC,EAAA,MAAM,MAAS,GAAA,MAAA,CAAO,IAAK,CAAA,QAAA,CAAS,EAAE,CAAA,CAAA;AAEtC,EAAM,MAAA,QAAA,GAAW,SAAS,WAAY,EAAA,CAAA;AACtC,EAAA,QAAA,CAAS,QAAS,CAAA,OAAA,CAAQ,IAAM,EAAA,OAAA,CAAQ,MAAM,CAAA,CAAA;AAC9C,EAAA,QAAA,CAAS,MAAO,CAAA,MAAA,CAAO,IAAM,EAAA,MAAA,CAAO,MAAM,CAAA,CAAA;AAE1C,EAAO,OAAA,QAAA,CAAA;AACT,CAAA;AAEgB,SAAA,iBAAA,CACd,GACA,CACA,EAAA;AACA,EAAI,IAAA,CAAC,CAAK,IAAA,CAAC,CAAG,EAAA;AACZ,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAO,OAAA,CAAA,CAAE,GAAG,CAAC,CAAA,CAAA;AACf;;;;"}
|
package/dist/version.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
const PKG_NAME = "@liveblocks/react-tiptap";
|
|
4
|
-
const PKG_VERSION = typeof "2.16.
|
|
4
|
+
const PKG_VERSION = typeof "2.16.2" === "string" && "2.16.2";
|
|
5
5
|
const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
|
|
6
6
|
|
|
7
7
|
exports.PKG_FORMAT = PKG_FORMAT;
|
package/dist/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":";;AAGO,MAAM,QAAW,GAAA,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,
|
|
1
|
+
{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":";;AAGO,MAAM,QAAW,GAAA,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,QAAA,KAAgB,QAAY,IAAA,SAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;;;"}
|
package/dist/version.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const PKG_NAME = "@liveblocks/react-tiptap";
|
|
2
|
-
const PKG_VERSION = typeof "2.16.
|
|
2
|
+
const PKG_VERSION = typeof "2.16.2" === "string" && "2.16.2";
|
|
3
3
|
const PKG_FORMAT = typeof "esm" === "string" && "esm";
|
|
4
4
|
|
|
5
5
|
export { PKG_FORMAT, PKG_NAME, PKG_VERSION };
|
package/dist/version.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.mjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":"AAGO,MAAM,QAAW,GAAA,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,
|
|
1
|
+
{"version":3,"file":"version.mjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":"AAGO,MAAM,QAAW,GAAA,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,QAAA,KAAgB,QAAY,IAAA,SAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@liveblocks/react-tiptap",
|
|
3
|
-
"version": "2.16.
|
|
3
|
+
"version": "2.16.2",
|
|
4
4
|
"description": "A tiptap react plugin to enable collaboration, comments, live cursors, and more.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -42,17 +42,16 @@
|
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@floating-ui/react-dom": "^2.1.2",
|
|
45
|
-
"@liveblocks/client": "2.16.
|
|
46
|
-
"@liveblocks/core": "2.16.
|
|
47
|
-
"@liveblocks/react": "2.16.
|
|
48
|
-
"@liveblocks/react-ui": "2.16.
|
|
49
|
-
"@liveblocks/yjs": "2.16.
|
|
45
|
+
"@liveblocks/client": "2.16.2",
|
|
46
|
+
"@liveblocks/core": "2.16.2",
|
|
47
|
+
"@liveblocks/react": "2.16.2",
|
|
48
|
+
"@liveblocks/react-ui": "2.16.2",
|
|
49
|
+
"@liveblocks/yjs": "2.16.2",
|
|
50
50
|
"@radix-ui/react-select": "^2.1.2",
|
|
51
51
|
"@radix-ui/react-toggle": "^1.1.0",
|
|
52
52
|
"@tiptap/core": "^2.7.2",
|
|
53
53
|
"@tiptap/react": "^2.7.2",
|
|
54
54
|
"@tiptap/suggestion": "^2.7.2",
|
|
55
|
-
"cmdk": "^1.0.4",
|
|
56
55
|
"y-prosemirror": "^1.2.12",
|
|
57
56
|
"yjs": "^13.6.18"
|
|
58
57
|
},
|
package/src/styles/index.css
CHANGED
|
@@ -132,9 +132,9 @@
|
|
|
132
132
|
}
|
|
133
133
|
|
|
134
134
|
:where(
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
) {
|
|
135
|
+
.lb-tiptap-thread-mark:not([data-orphan="true"])
|
|
136
|
+
.lb-tiptap-thread-mark-selected
|
|
137
|
+
) {
|
|
138
138
|
color: var(--lb-accent);
|
|
139
139
|
text-decoration-line: underline;
|
|
140
140
|
text-decoration-color: var(--lb-accent-moderate);
|
|
@@ -266,327 +266,6 @@
|
|
|
266
266
|
}
|
|
267
267
|
}
|
|
268
268
|
|
|
269
|
-
/*************************************
|
|
270
|
-
* AI Toolbar *
|
|
271
|
-
*************************************/
|
|
272
|
-
|
|
273
|
-
.lb-tiptap-ai-selection {
|
|
274
|
-
background: var(--lb-selection, rgb(0 0 255 / 20%));
|
|
275
|
-
pointer-events: none;
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
.lb-tiptap-ai-toolbar-portal {
|
|
279
|
-
display: flex;
|
|
280
|
-
flex-direction: column;
|
|
281
|
-
gap: 8px;
|
|
282
|
-
inline-size: var(--lb-tiptap-editor-width);
|
|
283
|
-
outline: none;
|
|
284
|
-
pointer-events: none;
|
|
285
|
-
|
|
286
|
-
&:where([data-liveblocks-ai-toolbar-flip]) {
|
|
287
|
-
flex-direction: column-reverse;
|
|
288
|
-
}
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
.lb-tiptap-ai-toolbar-container {
|
|
292
|
-
--lb-tiptap-ai-toolbar-padding: calc(0.5 * var(--lb-spacing));
|
|
293
|
-
--lb-tiptap-ai-toolbar-height: calc(
|
|
294
|
-
$lb-button-size + 2 * var(--lb-tiptap-ai-toolbar-padding)
|
|
295
|
-
);
|
|
296
|
-
|
|
297
|
-
position: relative;
|
|
298
|
-
min-block-size: var(--lb-tiptap-ai-toolbar-height);
|
|
299
|
-
}
|
|
300
|
-
|
|
301
|
-
.lb-tiptap-ai-toolbar {
|
|
302
|
-
display: flex;
|
|
303
|
-
flex-direction: column;
|
|
304
|
-
color: var(--lb-foreground);
|
|
305
|
-
pointer-events: auto;
|
|
306
|
-
}
|
|
307
|
-
|
|
308
|
-
.lb-tiptap-ai-toolbar-response-container,
|
|
309
|
-
.lb-tiptap-ai-toolbar-content {
|
|
310
|
-
max-block-size: calc(6lh + 2 * var(--lb-tiptap-ai-toolbar-padding));
|
|
311
|
-
|
|
312
|
-
/* overflow-block: auto; doesn't work as expected */
|
|
313
|
-
/* stylelint-disable-next-line plugin/use-logical-properties-and-values */
|
|
314
|
-
overflow-y: auto;
|
|
315
|
-
}
|
|
316
|
-
|
|
317
|
-
.lb-tiptap-ai-toolbar-content {
|
|
318
|
-
display: grid;
|
|
319
|
-
grid-template-columns: auto 1fr auto;
|
|
320
|
-
inline-size: 100%;
|
|
321
|
-
min-inline-size: 0;
|
|
322
|
-
padding: var(--lb-tiptap-ai-toolbar-padding);
|
|
323
|
-
outline: none;
|
|
324
|
-
}
|
|
325
|
-
|
|
326
|
-
.lb-tiptap-ai-toolbar-response-container {
|
|
327
|
-
--lb-line-height-crop: calc(1lh - 1em) / -2;
|
|
328
|
-
|
|
329
|
-
display: flex;
|
|
330
|
-
flex-direction: column;
|
|
331
|
-
padding: calc(var(--lb-spacing) + var(--lb-line-height-crop))
|
|
332
|
-
var(--lb-spacing);
|
|
333
|
-
border-block-end: 1px solid var(--lb-foreground-subtle);
|
|
334
|
-
}
|
|
335
|
-
|
|
336
|
-
.lb-tiptap-ai-toolbar-response {
|
|
337
|
-
white-space: pre-wrap;
|
|
338
|
-
|
|
339
|
-
&::before {
|
|
340
|
-
content: "\FEFF";
|
|
341
|
-
display: inline-block;
|
|
342
|
-
vertical-align: middle;
|
|
343
|
-
user-select: none;
|
|
344
|
-
}
|
|
345
|
-
}
|
|
346
|
-
|
|
347
|
-
.lb-tiptap-ai-toolbar-icon-container,
|
|
348
|
-
.lb-tiptap-ai-toolbar-actions {
|
|
349
|
-
display: flex;
|
|
350
|
-
flex: none;
|
|
351
|
-
block-size: $lb-button-size;
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
.lb-tiptap-ai-toolbar-icon-container {
|
|
355
|
-
position: sticky;
|
|
356
|
-
inset-block-start: 0;
|
|
357
|
-
align-items: center;
|
|
358
|
-
align-self: start;
|
|
359
|
-
color: var(--lb-foreground-moderate);
|
|
360
|
-
}
|
|
361
|
-
|
|
362
|
-
.lb-tiptap-ai-toolbar-actions {
|
|
363
|
-
position: sticky;
|
|
364
|
-
inset-block-end: 0;
|
|
365
|
-
gap: var(--lb-tiptap-ai-toolbar-padding);
|
|
366
|
-
align-self: end;
|
|
367
|
-
}
|
|
368
|
-
|
|
369
|
-
.lb-tiptap-ai-toolbar-custom-prompt {
|
|
370
|
-
all: unset;
|
|
371
|
-
background: transparent;
|
|
372
|
-
color: var(--lb-foreground);
|
|
373
|
-
outline: none;
|
|
374
|
-
resize: none;
|
|
375
|
-
|
|
376
|
-
&::placeholder {
|
|
377
|
-
color: var(--lb-foreground-moderate);
|
|
378
|
-
}
|
|
379
|
-
}
|
|
380
|
-
|
|
381
|
-
.lb-tiptap-ai-toolbar-custom-prompt-container {
|
|
382
|
-
position: relative;
|
|
383
|
-
z-index: auto;
|
|
384
|
-
display: grid;
|
|
385
|
-
margin-block: calc(-1 * var(--lb-tiptap-ai-toolbar-padding));
|
|
386
|
-
|
|
387
|
-
&::before {
|
|
388
|
-
/* The space is important when handling new lines */
|
|
389
|
-
content: attr(data-value) " ";
|
|
390
|
-
visibility: hidden;
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
|
-
|
|
394
|
-
.lb-tiptap-ai-toolbar-custom-prompt,
|
|
395
|
-
.lb-tiptap-ai-toolbar-custom-prompt-container::before {
|
|
396
|
-
/* Overlap the textarea and its value to auto-size it */
|
|
397
|
-
grid-area: 1 / 1 / 2 / 2;
|
|
398
|
-
box-sizing: inherit;
|
|
399
|
-
inline-size: 100%;
|
|
400
|
-
min-inline-size: 0;
|
|
401
|
-
padding: calc(
|
|
402
|
-
var(--lb-tiptap-ai-toolbar-padding) + ($lb-button-size - 1lh) / 2
|
|
403
|
-
)
|
|
404
|
-
var(--lb-tiptap-ai-toolbar-padding);
|
|
405
|
-
font: inherit;
|
|
406
|
-
letter-spacing: inherit;
|
|
407
|
-
white-space: pre-wrap;
|
|
408
|
-
}
|
|
409
|
-
|
|
410
|
-
.lb-tiptap-ai-toolbar-error {
|
|
411
|
-
--lb-dynamic-background: var(--lb-background-destructive-subtle);
|
|
412
|
-
|
|
413
|
-
position: relative;
|
|
414
|
-
display: flex;
|
|
415
|
-
gap: calc(0.5 * var(--lb-spacing));
|
|
416
|
-
align-items: center;
|
|
417
|
-
padding: var(--lb-tiptap-ai-toolbar-padding);
|
|
418
|
-
background: var(--lb-dynamic-background);
|
|
419
|
-
color: var(--lb-destructive);
|
|
420
|
-
font-size: 0.875em;
|
|
421
|
-
text-wrap: balance;
|
|
422
|
-
|
|
423
|
-
&::after {
|
|
424
|
-
content: "";
|
|
425
|
-
position: absolute;
|
|
426
|
-
inset: 0;
|
|
427
|
-
border-block-start: 1px solid var(--lb-destructive-moderate);
|
|
428
|
-
opacity: 0.35;
|
|
429
|
-
pointer-events: none;
|
|
430
|
-
}
|
|
431
|
-
|
|
432
|
-
:where(.lb-icon-container) {
|
|
433
|
-
color: var(--lb-destructive-secondary);
|
|
434
|
-
}
|
|
435
|
-
}
|
|
436
|
-
|
|
437
|
-
.lb-tiptap-ai-toolbar-halo {
|
|
438
|
-
--lb-tiptap-ai-toolbar-halo-blur: 16px;
|
|
439
|
-
--lb-tiptap-ai-toolbar-halo-outset: 8px;
|
|
440
|
-
|
|
441
|
-
position: absolute;
|
|
442
|
-
inset: calc(-1 * var(--lb-tiptap-ai-toolbar-halo-outset));
|
|
443
|
-
z-index: -1;
|
|
444
|
-
overflow: hidden;
|
|
445
|
-
border-radius: calc(
|
|
446
|
-
var(--lb-radius) + var(--lb-tiptap-ai-toolbar-halo-outset)
|
|
447
|
-
);
|
|
448
|
-
filter: blur(var(--lb-tiptap-ai-toolbar-halo-blur));
|
|
449
|
-
pointer-events: none;
|
|
450
|
-
transition-duration: 1s;
|
|
451
|
-
transition-property: opacity;
|
|
452
|
-
animation: lb-animation-ai-toolbar-halo-scale-in 1s
|
|
453
|
-
cubic-bezier(0.165, 0.84, 0.44, 1) both;
|
|
454
|
-
|
|
455
|
-
&:where(:not([data-active])) {
|
|
456
|
-
opacity: 0.5;
|
|
457
|
-
}
|
|
458
|
-
}
|
|
459
|
-
|
|
460
|
-
:is(
|
|
461
|
-
.lb-tiptap-ai-toolbar-halo-horizontal,
|
|
462
|
-
.lb-tiptap-ai-toolbar-halo-vertical
|
|
463
|
-
) {
|
|
464
|
-
position: absolute;
|
|
465
|
-
inset: 0;
|
|
466
|
-
|
|
467
|
-
&::before,
|
|
468
|
-
&::after {
|
|
469
|
-
content: "";
|
|
470
|
-
position: absolute;
|
|
471
|
-
inset: 0;
|
|
472
|
-
opacity: 0.175;
|
|
473
|
-
animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
|
|
474
|
-
animation-iteration-count: infinite;
|
|
475
|
-
}
|
|
476
|
-
}
|
|
477
|
-
|
|
478
|
-
.lb-tiptap-ai-toolbar-halo-horizontal {
|
|
479
|
-
&::before {
|
|
480
|
-
inline-size: 200%;
|
|
481
|
-
block-size: 100%;
|
|
482
|
-
background: linear-gradient(
|
|
483
|
-
30deg,
|
|
484
|
-
transparent 20%,
|
|
485
|
-
var(--lb-accent) 50%,
|
|
486
|
-
transparent 80%
|
|
487
|
-
);
|
|
488
|
-
background-position: top left;
|
|
489
|
-
background-size: 50% 100%;
|
|
490
|
-
animation-name: lb-animation-ai-toolbar-halo-horizontal;
|
|
491
|
-
animation-duration: 8s;
|
|
492
|
-
animation-direction: alternate;
|
|
493
|
-
}
|
|
494
|
-
|
|
495
|
-
&::after {
|
|
496
|
-
inset-inline-start: -50%;
|
|
497
|
-
inline-size: 400%;
|
|
498
|
-
block-size: 100%;
|
|
499
|
-
background: linear-gradient(
|
|
500
|
-
90deg,
|
|
501
|
-
transparent 20%,
|
|
502
|
-
var(--lb-accent) 50%,
|
|
503
|
-
transparent 80%
|
|
504
|
-
);
|
|
505
|
-
background-position: top left;
|
|
506
|
-
background-size: 75% 100%;
|
|
507
|
-
animation-name: lb-animation-ai-toolbar-halo-horizontal;
|
|
508
|
-
animation-duration: 6s;
|
|
509
|
-
animation-delay: -2s;
|
|
510
|
-
animation-direction: alternate-reverse;
|
|
511
|
-
}
|
|
512
|
-
}
|
|
513
|
-
|
|
514
|
-
.lb-tiptap-ai-toolbar-halo-vertical {
|
|
515
|
-
&::before {
|
|
516
|
-
inset-block-start: -50%;
|
|
517
|
-
inline-size: 100%;
|
|
518
|
-
block-size: 400%;
|
|
519
|
-
background: linear-gradient(
|
|
520
|
-
1deg,
|
|
521
|
-
transparent 40%,
|
|
522
|
-
var(--lb-accent) 50%,
|
|
523
|
-
transparent 60%
|
|
524
|
-
);
|
|
525
|
-
background-position: top left;
|
|
526
|
-
background-size: 100% 600px;
|
|
527
|
-
background-repeat: round;
|
|
528
|
-
animation-name: lb-animation-ai-toolbar-halo-vertical;
|
|
529
|
-
animation-duration: 4s;
|
|
530
|
-
animation-delay: -2s;
|
|
531
|
-
animation-direction: alternate-reverse;
|
|
532
|
-
}
|
|
533
|
-
|
|
534
|
-
&::after {
|
|
535
|
-
inset-block-start: -50%;
|
|
536
|
-
inline-size: 100%;
|
|
537
|
-
block-size: 400%;
|
|
538
|
-
background: linear-gradient(
|
|
539
|
-
-2deg,
|
|
540
|
-
transparent 40%,
|
|
541
|
-
var(--lb-accent) 50%,
|
|
542
|
-
transparent 60%
|
|
543
|
-
);
|
|
544
|
-
background-position: top left;
|
|
545
|
-
background-size: 100% 400px;
|
|
546
|
-
background-repeat: round;
|
|
547
|
-
animation-name: lb-animation-ai-toolbar-halo-vertical;
|
|
548
|
-
animation-duration: 3s;
|
|
549
|
-
animation-delay: -1s;
|
|
550
|
-
animation-direction: alternate;
|
|
551
|
-
}
|
|
552
|
-
}
|
|
553
|
-
|
|
554
|
-
.lb-tiptap-ai-toolbar-thinking {
|
|
555
|
-
@include truncate;
|
|
556
|
-
|
|
557
|
-
align-self: center;
|
|
558
|
-
min-inline-size: 0;
|
|
559
|
-
max-inline-size: fit-content;
|
|
560
|
-
padding-inline: var(--lb-tiptap-ai-toolbar-padding);
|
|
561
|
-
color: var(--lb-foreground-tertiary);
|
|
562
|
-
user-select: none;
|
|
563
|
-
animation: lb-animation-ai-toolbar-shimmer 8s linear infinite;
|
|
564
|
-
}
|
|
565
|
-
|
|
566
|
-
.lb-tiptap-ai-toolbar-dropdown {
|
|
567
|
-
inline-size: min(250px, 100%);
|
|
568
|
-
pointer-events: auto;
|
|
569
|
-
}
|
|
570
|
-
|
|
571
|
-
/*************************************
|
|
572
|
-
* Diff Changes *
|
|
573
|
-
*************************************/
|
|
574
|
-
|
|
575
|
-
.lb-tiptap-change-removed {
|
|
576
|
-
color: color-mix(in srgb, currentcolor 40%, transparent);
|
|
577
|
-
text-decoration: line-through;
|
|
578
|
-
text-decoration-thickness: 1px;
|
|
579
|
-
}
|
|
580
|
-
|
|
581
|
-
.lb-tiptap-change-added {
|
|
582
|
-
background: color-mix(
|
|
583
|
-
in srgb,
|
|
584
|
-
var(--lb-accent) calc(var(--lb-accent-contrast) * 1.5),
|
|
585
|
-
transparent
|
|
586
|
-
);
|
|
587
|
-
color: var(--lb-accent);
|
|
588
|
-
}
|
|
589
|
-
|
|
590
269
|
/*************************************
|
|
591
270
|
* Collab Cursors *
|
|
592
271
|
*************************************/
|
|
@@ -621,59 +300,3 @@
|
|
|
621
300
|
pointer-events: none;
|
|
622
301
|
user-select: none;
|
|
623
302
|
}
|
|
624
|
-
|
|
625
|
-
/*************************************
|
|
626
|
-
* Animations *
|
|
627
|
-
*************************************/
|
|
628
|
-
|
|
629
|
-
@keyframes lb-animation-ai-toolbar-shimmer {
|
|
630
|
-
from,
|
|
631
|
-
to {
|
|
632
|
-
mask-image: linear-gradient(
|
|
633
|
-
90deg,
|
|
634
|
-
#000 8%,
|
|
635
|
-
rgb(0 0 0 / 50%) 20%,
|
|
636
|
-
rgb(0 0 0 / 50%) 80%,
|
|
637
|
-
#000 92%
|
|
638
|
-
);
|
|
639
|
-
mask-size: 400% 100%;
|
|
640
|
-
}
|
|
641
|
-
|
|
642
|
-
from {
|
|
643
|
-
mask-position: 200% 0;
|
|
644
|
-
}
|
|
645
|
-
|
|
646
|
-
to {
|
|
647
|
-
mask-position: -200% 0;
|
|
648
|
-
}
|
|
649
|
-
}
|
|
650
|
-
|
|
651
|
-
@keyframes lb-animation-ai-toolbar-halo-scale-in {
|
|
652
|
-
from {
|
|
653
|
-
transform: scale(0.5);
|
|
654
|
-
}
|
|
655
|
-
|
|
656
|
-
to {
|
|
657
|
-
transform: scale(1);
|
|
658
|
-
}
|
|
659
|
-
}
|
|
660
|
-
|
|
661
|
-
@keyframes lb-animation-ai-toolbar-halo-horizontal {
|
|
662
|
-
from {
|
|
663
|
-
transform: translateX(-50%);
|
|
664
|
-
}
|
|
665
|
-
|
|
666
|
-
to {
|
|
667
|
-
transform: translateX(0);
|
|
668
|
-
}
|
|
669
|
-
}
|
|
670
|
-
|
|
671
|
-
@keyframes lb-animation-ai-toolbar-halo-vertical {
|
|
672
|
-
from {
|
|
673
|
-
transform: translateY(0);
|
|
674
|
-
}
|
|
675
|
-
|
|
676
|
-
to {
|
|
677
|
-
transform: translateY(-50%);
|
|
678
|
-
}
|
|
679
|
-
}
|
package/src/styles/utils.css
CHANGED
package/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.lb-tiptap-suggestions-list{margin:0;padding:0;list-style:none}.lb-tiptap-mention-suggestions{--lb-tiptap-mention-suggestion-avatar-size:1.25rem}.lb-tiptap-mention-suggestion{padding:calc(.375*var(--lb-spacing))calc(.625*var(--lb-spacing))}.lb-tiptap-mention-suggestion-avatar{inline-size:var(--lb-tiptap-mention-suggestion-avatar-size);margin-inline-start:calc(-.125*var(--lb-spacing));margin-inline-end:calc(.5*var(--lb-spacing));margin-block:calc(.125*var(--lb-spacing));background:var(--lb-foreground-subtle);color:var(--lb-foreground-moderate)}.lb-tiptap-suggestions{animation-duration:var(--lb-transition-duration);animation-timing-function:var(--lb-transition-easing);will-change:transform,opacity;padding:4px}.lb-tiptap-suggestions-list-item{padding:calc(.25*var(--lb-spacing))calc(.5*var(--lb-spacing));border-radius:calc(var(--lb-radius) - .75*4px);color:var(--lb-foreground-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;scroll-margin-block:4px;font-size:.875rem;transition-property:background,color,opacity;display:flex}.lb-tiptap-suggestions-list-item:where([data-highlighted]:not([data-highlighted=false]),[data-selected]:not([data-selected=false])){background:var(--lb-foreground-subtle);transition-duration:calc(var(--lb-transition-duration)/2)}.lb-tiptap-suggestions-list-item:where(:disabled,[data-disabled]:not([data-disabled=false])){opacity:.5;cursor:not-allowed}.lb-tiptap-suggestions:where([data-side=top]){animation-name:lb-animation-slide-up}.lb-tiptap-suggestions:where([data-side=bottom]){animation-name:lb-animation-slide-down}.lb-tiptap-suggestions:where([data-state=closed]){animation-name:lb-animation-disappear}.lb-tiptap-mention{border-radius:calc(.675*var(--lb-radius));background:var(--lb-accent-subtle);color:var(--lb-accent);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:.1em .3em;font-weight:500}.lb-tiptap-mention::selection{background:0 0}.lb-tiptap-mention ::selection{background:0 0}.lb-mention-selected{background:var(--lb-accent);color:var(--lb-accent-foreground)}:where(.lb-tiptap-thread-mark:not([data-orphan=true])){background:var(--lb-accent-subtle);color:var(--lb-foreground);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-foreground-moderate);text-decoration-color:var(--lb-foreground-moderate);text-underline-offset:2px;outline:none;font-weight:500;transition-property:color,text-decoration-color}:where(.lb-tiptap-thread-mark:not([data-orphan=true]) .lb-tiptap-thread-mark-selected){color:var(--lb-accent);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-accent-moderate);text-decoration-color:var(--lb-accent-moderate);text-underline-offset:2px}.lb-tiptap-anchored-threads{--lb-tiptap-anchored-threads-gap:1.25rem;--lb-tiptap-anchored-threads-active-thread-offset:-.75rem}.lb-tiptap-anchored-threads-thread-container{transition-duration:calc(var(--lb-transition-duration)*2);transition-property:transform}.lb-tiptap-anchored-threads-thread{border-radius:var(--lb-radius);background:var(--lb-dynamic-background);transition-property:background,box-shadow;position:relative;overflow:hidden;box-shadow:0 0 0 1px #0000000a,0 2px 6px #0000000a,0 6px 20px #0000000f}.lb-tiptap-anchored-threads-thread:after{content:"";z-index:1;border-radius:inherit;box-shadow:var(--lb-inset-shadow);pointer-events:none;position:absolute;inset:0}.lb-tiptap-anchored-threads-thread:where([data-state=active]){box-shadow:0 0 0 1px #0000000a,0 2px 6px #00000014,0 8px 26px #0000001f}.lb-tiptap-floating{--lb-tiptap-floating-size:350px}.lb-tiptap-floating-threads-thread{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-floating-threads-thread:where(:not(:last-of-type)){border-block-end:1px solid var(--lb-foreground-subtle)}.lb-tiptap-floating-composer{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-active-selection{background:var(--lb-selection,#00f3);pointer-events:none}.lb-tiptap-toolbar{--lb-tiptap-toolbar-spacing:calc(.25*var(--lb-spacing));gap:var(--lb-tiptap-toolbar-spacing);padding:var(--lb-tiptap-toolbar-spacing);background:var(--lb-background);-ms-overflow-style:none;scrollbar-width:none;flex-direction:row;align-items:center;display:flex;position:relative;overflow-x:auto}.lb-tiptap-toolbar::-webkit-scrollbar{display:none}.lb-tiptap-toolbar>*{flex:none}.lb-tiptap-floating-toolbar{--lb-tiptap-toolbar-spacing:4px}.lb-tiptap-toolbar-separator{pointer-events:none;align-self:stretch;inline-size:1px;margin-inline:1px;position:relative}.lb-tiptap-toolbar-separator:before{content:"";background:var(--lb-foreground-subtle);position:absolute;inset:10% 0}.lb-tiptap-ai-selection{background:var(--lb-selection,#00f3);pointer-events:none}.lb-tiptap-ai-toolbar-portal{inline-size:var(--lb-tiptap-editor-width);pointer-events:none;outline:none;flex-direction:column;gap:8px;display:flex}.lb-tiptap-ai-toolbar-portal:where([data-liveblocks-ai-toolbar-flip]){flex-direction:column-reverse}.lb-tiptap-ai-toolbar-container{--lb-tiptap-ai-toolbar-padding:calc(.5*var(--lb-spacing));--lb-tiptap-ai-toolbar-height:calc(calc(2*.25*var(--lb-spacing) + var(--lb-icon-size)) + 2*var(--lb-tiptap-ai-toolbar-padding));min-block-size:var(--lb-tiptap-ai-toolbar-height);position:relative}.lb-tiptap-ai-toolbar{color:var(--lb-foreground);pointer-events:auto;flex-direction:column;display:flex}.lb-tiptap-ai-toolbar-response-container,.lb-tiptap-ai-toolbar-content{max-block-size:calc(6lh + 2*var(--lb-tiptap-ai-toolbar-padding));overflow-y:auto}.lb-tiptap-ai-toolbar-content{padding:var(--lb-tiptap-ai-toolbar-padding);outline:none;grid-template-columns:auto 1fr auto;inline-size:100%;min-inline-size:0;display:grid}.lb-tiptap-ai-toolbar-response-container{--lb-line-height-crop:calc(1lh - 1em)/-2;padding:calc(var(--lb-spacing) + var(--lb-line-height-crop))var(--lb-spacing);border-block-end:1px solid var(--lb-foreground-subtle);flex-direction:column;display:flex}.lb-tiptap-ai-toolbar-response{white-space:pre-wrap}.lb-tiptap-ai-toolbar-response:before{content:"";vertical-align:middle;-webkit-user-select:none;user-select:none;display:inline-block}.lb-tiptap-ai-toolbar-icon-container,.lb-tiptap-ai-toolbar-actions{block-size:calc(2*.25*var(--lb-spacing) + var(--lb-icon-size));flex:none;display:flex}.lb-tiptap-ai-toolbar-icon-container{color:var(--lb-foreground-moderate);align-self:start;align-items:center;position:sticky;inset-block-start:0}.lb-tiptap-ai-toolbar-actions{gap:var(--lb-tiptap-ai-toolbar-padding);align-self:end;position:sticky;inset-block-end:0}.lb-tiptap-ai-toolbar-custom-prompt{all:unset;color:var(--lb-foreground);resize:none;background:0 0;outline:none}.lb-tiptap-ai-toolbar-custom-prompt::placeholder{color:var(--lb-foreground-moderate)}.lb-tiptap-ai-toolbar-custom-prompt-container{z-index:auto;margin-block:calc(-1*var(--lb-tiptap-ai-toolbar-padding));display:grid;position:relative}.lb-tiptap-ai-toolbar-custom-prompt-container:before{content:attr(data-value)" ";visibility:hidden}.lb-tiptap-ai-toolbar-custom-prompt,.lb-tiptap-ai-toolbar-custom-prompt-container:before{box-sizing:inherit;padding:calc(var(--lb-tiptap-ai-toolbar-padding) + (calc(2*.25*var(--lb-spacing) + var(--lb-icon-size)) - 1lh)/2)var(--lb-tiptap-ai-toolbar-padding);font:inherit;letter-spacing:inherit;white-space:pre-wrap;grid-area:1/1/2/2;inline-size:100%;min-inline-size:0}.lb-tiptap-ai-toolbar-error{--lb-dynamic-background:var(--lb-background-destructive-subtle);gap:calc(.5*var(--lb-spacing));padding:var(--lb-tiptap-ai-toolbar-padding);background:var(--lb-dynamic-background);color:var(--lb-destructive);text-wrap:balance;align-items:center;font-size:.875em;display:flex;position:relative}.lb-tiptap-ai-toolbar-error:after{content:"";border-block-start:1px solid var(--lb-destructive-moderate);opacity:.35;pointer-events:none;position:absolute;inset:0}.lb-tiptap-ai-toolbar-error :where(.lb-icon-container){color:var(--lb-destructive-secondary)}.lb-tiptap-ai-toolbar-halo{--lb-tiptap-ai-toolbar-halo-blur:16px;--lb-tiptap-ai-toolbar-halo-outset:8px;inset:calc(-1*var(--lb-tiptap-ai-toolbar-halo-outset));z-index:-1;border-radius:calc(var(--lb-radius) + var(--lb-tiptap-ai-toolbar-halo-outset));filter:blur(var(--lb-tiptap-ai-toolbar-halo-blur));pointer-events:none;transition-property:opacity;transition-duration:1s;animation:1s cubic-bezier(.165,.84,.44,1) both lb-animation-ai-toolbar-halo-scale-in;position:absolute;overflow:hidden}.lb-tiptap-ai-toolbar-halo:where(:not([data-active])){opacity:.5}:is(.lb-tiptap-ai-toolbar-halo-horizontal,.lb-tiptap-ai-toolbar-halo-vertical){position:absolute;inset:0}:is(.lb-tiptap-ai-toolbar-halo-horizontal,.lb-tiptap-ai-toolbar-halo-vertical):before,:is(.lb-tiptap-ai-toolbar-halo-horizontal,.lb-tiptap-ai-toolbar-halo-vertical):after{content:"";opacity:.175;animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-iteration-count:infinite;position:absolute;inset:0}.lb-tiptap-ai-toolbar-halo-horizontal:before{background:linear-gradient(30deg,transparent 20%,var(--lb-accent)50%,transparent 80%);background-position:0 0;background-size:50% 100%;block-size:100%;inline-size:200%;animation-name:lb-animation-ai-toolbar-halo-horizontal;animation-duration:8s;animation-direction:alternate}.lb-tiptap-ai-toolbar-halo-horizontal:after{background:linear-gradient(90deg,transparent 20%,var(--lb-accent)50%,transparent 80%);background-position:0 0;background-size:75% 100%;block-size:100%;inline-size:400%;animation-name:lb-animation-ai-toolbar-halo-horizontal;animation-duration:6s;animation-direction:alternate-reverse;animation-delay:-2s;inset-inline-start:-50%}.lb-tiptap-ai-toolbar-halo-vertical:before{background:linear-gradient(1deg,transparent 40%,var(--lb-accent)50%,transparent 60%);background-position:0 0;background-repeat:round;background-size:100% 600px;block-size:400%;inline-size:100%;animation-name:lb-animation-ai-toolbar-halo-vertical;animation-duration:4s;animation-direction:alternate-reverse;animation-delay:-2s;inset-block-start:-50%}.lb-tiptap-ai-toolbar-halo-vertical:after{background:linear-gradient(-2deg,transparent 40%,var(--lb-accent)50%,transparent 60%);background-position:0 0;background-repeat:round;background-size:100% 400px;block-size:400%;inline-size:100%;animation-name:lb-animation-ai-toolbar-halo-vertical;animation-duration:3s;animation-direction:alternate;animation-delay:-1s;inset-block-start:-50%}.lb-tiptap-ai-toolbar-thinking{text-overflow:ellipsis;white-space:nowrap;padding-inline:var(--lb-tiptap-ai-toolbar-padding);color:var(--lb-foreground-tertiary);-webkit-user-select:none;user-select:none;align-self:center;min-inline-size:0;max-inline-size:-moz-fit-content;max-inline-size:fit-content;animation:8s linear infinite lb-animation-ai-toolbar-shimmer;overflow:hidden}.lb-tiptap-ai-toolbar-dropdown{pointer-events:auto;inline-size:min(250px,100%)}.lb-tiptap-change-removed{color:color-mix(in srgb,currentcolor 40%,transparent);text-decoration:line-through;text-decoration-thickness:1px}.lb-tiptap-change-added{background:color-mix(in srgb,var(--lb-accent)calc(var(--lb-accent-contrast)*1.5),transparent);color:var(--lb-accent)}.collaboration-cursor__caret{word-break:normal;pointer-events:none;border-inline:1px solid #0d0d0d;margin-inline:-1px;position:relative}.collaboration-cursor__label{border-radius:6px;color:#fff;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;border-end-start-radius:0;padding:2px 6px;font-size:14px;font-style:normal;font-weight:600;line-height:normal;position:absolute;inset-block-start:-1.4em;inset-inline-start:-1px}@keyframes lb-animation-ai-toolbar-shimmer{0%,to{-webkit-mask-image:linear-gradient(90deg,#000 8%,#00000080 20% 80%,#000 92%);mask-image:linear-gradient(90deg,#000 8%,#00000080 20% 80%,#000 92%);-webkit-mask-size:400% 100%;mask-size:400% 100%}0%{-webkit-mask-position:200% 0;mask-position:200% 0}to{-webkit-mask-position:-200% 0;mask-position:-200% 0}}@keyframes lb-animation-ai-toolbar-halo-scale-in{0%{transform:scale(.5)}to{transform:scale(1)}}@keyframes lb-animation-ai-toolbar-halo-horizontal{0%{transform:translate(-50%)}to{transform:translate(0)}}@keyframes lb-animation-ai-toolbar-halo-vertical{0%{transform:translateY(0)}to{transform:translateY(-50%)}}@media (prefers-reduced-motion){.lb-tiptap-suggestions:where(:not([data-state=closed])){animation-name:lb-animation-appear}.lb-tiptap-anchored-threads-thread-container{transition-duration:0s}}
|
|
1
|
+
.lb-tiptap-suggestions-list{margin:0;padding:0;list-style:none}.lb-tiptap-mention-suggestions{--lb-tiptap-mention-suggestion-avatar-size:1.25rem}.lb-tiptap-mention-suggestion{padding:calc(.375*var(--lb-spacing))calc(.625*var(--lb-spacing))}.lb-tiptap-mention-suggestion-avatar{inline-size:var(--lb-tiptap-mention-suggestion-avatar-size);margin-inline-start:calc(-.125*var(--lb-spacing));margin-inline-end:calc(.5*var(--lb-spacing));margin-block:calc(.125*var(--lb-spacing));background:var(--lb-foreground-subtle);color:var(--lb-foreground-moderate)}.lb-tiptap-suggestions{animation-duration:var(--lb-transition-duration);animation-timing-function:var(--lb-transition-easing);will-change:transform,opacity;padding:4px}.lb-tiptap-suggestions-list-item{padding:calc(.25*var(--lb-spacing))calc(.5*var(--lb-spacing));border-radius:calc(var(--lb-radius) - .75*4px);color:var(--lb-foreground-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;scroll-margin-block:4px;font-size:.875rem;transition-property:background,color,opacity;display:flex}.lb-tiptap-suggestions-list-item:where([data-highlighted]:not([data-highlighted=false]),[data-selected]:not([data-selected=false])){background:var(--lb-foreground-subtle);transition-duration:calc(var(--lb-transition-duration)/2)}.lb-tiptap-suggestions-list-item:where(:disabled,[data-disabled]:not([data-disabled=false])){opacity:.5;cursor:not-allowed}.lb-tiptap-suggestions:where([data-side=top]){animation-name:lb-animation-slide-up}.lb-tiptap-suggestions:where([data-side=bottom]){animation-name:lb-animation-slide-down}.lb-tiptap-suggestions:where([data-state=closed]){animation-name:lb-animation-disappear}.lb-tiptap-mention{border-radius:calc(.675*var(--lb-radius));background:var(--lb-accent-subtle);color:var(--lb-accent);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:.1em .3em;font-weight:500}.lb-tiptap-mention::selection{background:0 0}.lb-tiptap-mention ::selection{background:0 0}.lb-mention-selected{background:var(--lb-accent);color:var(--lb-accent-foreground)}:where(.lb-tiptap-thread-mark:not([data-orphan=true])){background:var(--lb-accent-subtle);color:var(--lb-foreground);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-foreground-moderate);text-decoration-color:var(--lb-foreground-moderate);text-underline-offset:2px;outline:none;font-weight:500;transition-property:color,text-decoration-color}:where(.lb-tiptap-thread-mark:not([data-orphan=true]) .lb-tiptap-thread-mark-selected){color:var(--lb-accent);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-accent-moderate);text-decoration-color:var(--lb-accent-moderate);text-underline-offset:2px}.lb-tiptap-anchored-threads{--lb-tiptap-anchored-threads-gap:1.25rem;--lb-tiptap-anchored-threads-active-thread-offset:-.75rem}.lb-tiptap-anchored-threads-thread-container{transition-duration:calc(var(--lb-transition-duration)*2);transition-property:transform}.lb-tiptap-anchored-threads-thread{border-radius:var(--lb-radius);background:var(--lb-dynamic-background);transition-property:background,box-shadow;position:relative;overflow:hidden;box-shadow:0 0 0 1px #0000000a,0 2px 6px #0000000a,0 6px 20px #0000000f}.lb-tiptap-anchored-threads-thread:after{content:"";z-index:1;border-radius:inherit;box-shadow:var(--lb-inset-shadow);pointer-events:none;position:absolute;inset:0}.lb-tiptap-anchored-threads-thread:where([data-state=active]){box-shadow:0 0 0 1px #0000000a,0 2px 6px #00000014,0 8px 26px #0000001f}.lb-tiptap-floating{--lb-tiptap-floating-size:350px}.lb-tiptap-floating-threads-thread{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-floating-threads-thread:where(:not(:last-of-type)){border-block-end:1px solid var(--lb-foreground-subtle)}.lb-tiptap-floating-composer{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-active-selection{background:var(--lb-selection,#00f3);pointer-events:none}.lb-tiptap-toolbar{--lb-tiptap-toolbar-spacing:calc(.25*var(--lb-spacing));gap:var(--lb-tiptap-toolbar-spacing);padding:var(--lb-tiptap-toolbar-spacing);background:var(--lb-background);-ms-overflow-style:none;scrollbar-width:none;flex-direction:row;align-items:center;display:flex;position:relative;overflow-x:auto}.lb-tiptap-toolbar::-webkit-scrollbar{display:none}.lb-tiptap-toolbar>*{flex:none}.lb-tiptap-floating-toolbar{--lb-tiptap-toolbar-spacing:4px}.lb-tiptap-toolbar-separator{pointer-events:none;align-self:stretch;inline-size:1px;margin-inline:1px;position:relative}.lb-tiptap-toolbar-separator:before{content:"";background:var(--lb-foreground-subtle);position:absolute;inset:10% 0}.collaboration-cursor__caret{word-break:normal;pointer-events:none;border-inline:1px solid #0d0d0d;margin-inline:-1px;position:relative}.collaboration-cursor__label{border-radius:6px;color:#fff;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;border-end-start-radius:0;padding:2px 6px;font-size:14px;font-style:normal;font-weight:600;line-height:normal;position:absolute;inset-block-start:-1.4em;inset-inline-start:-1px}@media (prefers-reduced-motion){.lb-tiptap-suggestions:where(:not([data-state=closed])){animation-name:lb-animation-appear}.lb-tiptap-anchored-threads-thread-container{transition-duration:0s}}
|
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-ai-toolbar-shimmer 8s 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 * Collab 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-shimmer {\n from,\n to {\n mask-image: linear-gradient(\n 90deg,\n #000 8%,\n rgb(0 0 0 / 50%) 20%,\n rgb(0 0 0 / 50%) 80%,\n #000 92%\n );\n mask-size: 400% 100%;\n }\n\n from {\n mask-position: 200% 0;\n }\n\n to {\n mask-position: -200% 0;\n }\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,uDAAA,kCAAA,CAAA,0BAAA,CAAA,8BAAA,CAAA,2DAAA,CAAA,mDAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,eAAA,CAAA,+CAAA,CAWA,uFAAA,sBAAA,CAAA,8BAAA,CAAA,uDAAA,CAAA,+CAAA,CAAA,yBAAA,CAcA,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,CCtNE,sCAAA,YAAA,CDuOA,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,CAcF,6BAAA,iBAAA,CAAA,mBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,iBAAA,CAYA,6BAAA,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,CAlMA,gCACE,wDAAA,kCAAA,CAiEA,6CAAA,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\"])) {\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 * Collab 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","@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"]}
|