@mindlogic-ai/logician-ui 3.2.0-alpha.5 → 4.0.0-alpha.10
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/components/Loaders/PageLoader.d.ts.map +1 -1
- package/dist/components/Loaders/PageLoader.js +2 -2
- package/dist/components/Loaders/PageLoader.js.map +1 -1
- package/dist/components/Loaders/PageLoader.mjs +2 -2
- package/dist/components/Loaders/PageLoader.mjs.map +1 -1
- package/dist/components/Loaders/SectionLoader.d.ts.map +1 -1
- package/dist/components/Loaders/SectionLoader.js +2 -2
- package/dist/components/Loaders/SectionLoader.js.map +1 -1
- package/dist/components/Loaders/SectionLoader.mjs +2 -2
- package/dist/components/Loaders/SectionLoader.mjs.map +1 -1
- package/dist/components/Tag/Tag.d.ts.map +1 -1
- package/dist/components/Tag/Tag.js +1 -1
- package/dist/components/Tag/Tag.js.map +1 -1
- package/dist/components/Tag/Tag.mjs +1 -1
- package/dist/components/Tag/Tag.mjs.map +1 -1
- package/dist/components/Tag/Tag.styles.d.ts.map +1 -1
- package/dist/components/Tag/Tag.styles.js +22 -16
- package/dist/components/Tag/Tag.styles.js.map +1 -1
- package/dist/components/Tag/Tag.styles.mjs +22 -16
- package/dist/components/Tag/Tag.styles.mjs.map +1 -1
- package/dist/components/Tree/Tree.d.ts +5 -1
- package/dist/components/Tree/Tree.d.ts.map +1 -1
- package/dist/components/Tree/Tree.types.d.ts +29 -1
- package/dist/components/Tree/Tree.types.d.ts.map +1 -1
- package/dist/components/Tree/TreeBranchIndentGuide.d.ts +5 -1
- package/dist/components/Tree/TreeBranchIndentGuide.d.ts.map +1 -1
- package/dist/components/Tree/TreeBranchIndentGuide.js +107 -8
- package/dist/components/Tree/TreeBranchIndentGuide.js.map +1 -1
- package/dist/components/Tree/TreeBranchIndentGuide.mjs +107 -8
- package/dist/components/Tree/TreeBranchIndentGuide.mjs.map +1 -1
- package/dist/components/Typography/Link.d.ts.map +1 -1
- package/dist/components/Typography/Link.js +6 -1
- package/dist/components/Typography/Link.js.map +1 -1
- package/dist/components/Typography/Link.mjs +6 -1
- package/dist/components/Typography/Link.mjs.map +1 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.d.ts.map +1 -1
- 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/theme/global.d.ts.map +1 -1
- package/dist/theme/global.js +4 -1
- package/dist/theme/global.js.map +1 -1
- package/dist/theme/global.mjs +4 -1
- package/dist/theme/global.mjs.map +1 -1
- package/dist/theme/index.d.ts +1 -1
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/index.js +8 -4
- package/dist/theme/index.js.map +1 -1
- package/dist/theme/index.mjs +8 -4
- package/dist/theme/index.mjs.map +1 -1
- package/package.json +1 -3
- package/src/components/Loaders/PageLoader.tsx +3 -5
- package/src/components/Loaders/SectionLoader.tsx +3 -2
- package/src/components/Tag/Tag.styles.ts +22 -16
- package/src/components/Tag/Tag.tsx +1 -0
- package/src/components/Tree/Tree.GuideElbow.stories.tsx +220 -0
- package/src/components/Tree/Tree.types.ts +29 -1
- package/src/components/Tree/TreeBranchIndentGuide.test.tsx +213 -0
- package/src/components/Tree/TreeBranchIndentGuide.tsx +137 -11
- package/src/components/Typography/Link.tsx +5 -1
- package/src/index.ts +0 -1
- package/src/theme/global.ts +4 -1
- package/src/theme/index.ts +8 -4
- package/dist/components/MDXEditor/MDXEditor.d.ts +0 -6
- package/dist/components/MDXEditor/MDXEditor.d.ts.map +0 -1
- package/dist/components/MDXEditor/MDXEditor.js +0 -237
- package/dist/components/MDXEditor/MDXEditor.js.map +0 -1
- package/dist/components/MDXEditor/MDXEditor.mjs +0 -235
- package/dist/components/MDXEditor/MDXEditor.mjs.map +0 -1
- package/dist/components/MDXEditor/MDXEditor.types.d.ts +0 -7
- package/dist/components/MDXEditor/MDXEditor.types.d.ts.map +0 -1
- package/dist/components/MDXEditor/index.d.ts +0 -3
- package/dist/components/MDXEditor/index.d.ts.map +0 -1
- package/src/components/MDXEditor/MDXEditor.css +0 -40
- package/src/components/MDXEditor/MDXEditor.stories.tsx +0 -56
- package/src/components/MDXEditor/MDXEditor.tsx +0 -337
- package/src/components/MDXEditor/MDXEditor.types.ts +0 -7
- package/src/components/MDXEditor/index.ts +0 -2
|
@@ -3,18 +3,144 @@ import { TreeView as ChakraTreeView } from '@chakra-ui/react';
|
|
|
3
3
|
|
|
4
4
|
import { TreeBranchIndentGuideProps } from './Tree.types';
|
|
5
5
|
|
|
6
|
+
// Extra per-level indentation in elbow mode. Guide-line trees read better
|
|
7
|
+
// with a little more horizontal air between the elbow and the row text,
|
|
8
|
+
// so each level indents this much further than the recipe default. The
|
|
9
|
+
// foot length does NOT grow with it (its default is derived from the
|
|
10
|
+
// original `--tree-indentation`), so the foot-to-text gap widens by the
|
|
11
|
+
// same amount.
|
|
12
|
+
const ELBOW_EXTRA_INDENT = '4px';
|
|
13
|
+
|
|
14
|
+
// The widened per-level indentation, defined on the guide's sibling rows
|
|
15
|
+
// so both the recipe's offset math and our pseudo-element math can share
|
|
16
|
+
// it. Root rows (depth 1) have no guide sibling, but their offset
|
|
17
|
+
// multiplies indentation by zero, so every level stays consistent.
|
|
18
|
+
const ELBOW_INDENT_VARS = {
|
|
19
|
+
'--tree-elbow-indentation': `calc(var(--tree-indentation) + ${ELBOW_EXTRA_INDENT})`,
|
|
20
|
+
} as const;
|
|
21
|
+
|
|
22
|
+
// Re-derive the recipe's `--tree-indentation-offset` (which feeds
|
|
23
|
+
// `--tree-offset`, the row's padding-start) from the widened indentation.
|
|
24
|
+
// Must be set on the same elements the recipe defines it on
|
|
25
|
+
// (item / branch-control) — inheritance can't override those.
|
|
26
|
+
const ELBOW_OFFSET_VARS = {
|
|
27
|
+
'--tree-indentation-offset':
|
|
28
|
+
'calc(var(--tree-elbow-indentation) * var(--tree-depth))',
|
|
29
|
+
} as const;
|
|
30
|
+
|
|
31
|
+
// The parent rail column, measured from a child row (item / branch-control).
|
|
32
|
+
// A row's content starts at its own `--tree-offset`, and the parent rail
|
|
33
|
+
// sits exactly one (widened) indentation to its left (verified against the
|
|
34
|
+
// recipe's offset math for both the guide and the row slots).
|
|
35
|
+
const ROW_RAIL_COLUMN =
|
|
36
|
+
'calc(var(--tree-offset) - var(--tree-elbow-indentation))';
|
|
37
|
+
|
|
38
|
+
// The same column, computed from the `branch` element itself. A branch
|
|
39
|
+
// only carries Ark's inline `--depth` (the recipe's `--tree-offset` is
|
|
40
|
+
// defined on item/branch-control, not here), so expand the recipe math:
|
|
41
|
+
// rail(x) = padding + indentation * (depth - 2) + icon * 0.5 * (depth - 1)
|
|
42
|
+
// — algebraically identical to ROW_RAIL_COLUMN for a row at `--depth`.
|
|
43
|
+
const BRANCH_RAIL_COLUMN =
|
|
44
|
+
'calc(var(--tree-padding-inline) + var(--tree-elbow-indentation) * (var(--depth) - 2) + var(--tree-icon-size) * 0.5 * (var(--depth) - 1))';
|
|
45
|
+
|
|
6
46
|
export const TreeBranchIndentGuide = forwardRef<
|
|
7
47
|
HTMLDivElement,
|
|
8
48
|
TreeBranchIndentGuideProps
|
|
9
|
-
>(
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
)
|
|
19
|
-
|
|
49
|
+
>(
|
|
50
|
+
(
|
|
51
|
+
{
|
|
52
|
+
elbow = false,
|
|
53
|
+
footLength = 'calc(var(--tree-indentation) - 4px)',
|
|
54
|
+
guideColor = 'border.default',
|
|
55
|
+
...props
|
|
56
|
+
},
|
|
57
|
+
ref
|
|
58
|
+
) => {
|
|
59
|
+
// Chakra v3's `branchIndentGuide` slot renders ONE absolutely-positioned
|
|
60
|
+
// vertical line per `branchContent` (its first child), `height: 100%`,
|
|
61
|
+
// with `insetInlineStart` auto-calculated from tree depth. Don't add
|
|
62
|
+
// `ms`/`ps` (breaks the depth math) or `borderInlineStartWidth` (stacks
|
|
63
|
+
// a second 1px stroke on the slot's own bg-painted 1px) — only `bg`.
|
|
64
|
+
//
|
|
65
|
+
// That single full-height rail cannot form a `└` on the last row: it
|
|
66
|
+
// always paints past the last row's centre down to the content bottom.
|
|
67
|
+
// So in `elbow` mode the slot's own rail is hidden (`bg: transparent`,
|
|
68
|
+
// the element stays as the CSS sibling anchor) and the guide lines are
|
|
69
|
+
// re-drawn per row on the guide's sibling rows (`[data-part="item"]`
|
|
70
|
+
// leaves and `[data-part="branch"]` subtrees):
|
|
71
|
+
//
|
|
72
|
+
// - every row gets a `::before` foot — the horizontal cross-stroke
|
|
73
|
+
// from the rail column toward the row content, pinned to the row's
|
|
74
|
+
// vertical centre;
|
|
75
|
+
// - non-last rows get a full-height vertical segment (`├`); for a
|
|
76
|
+
// branch it is drawn on the `[data-part="branch"]` element so it
|
|
77
|
+
// passes through the whole expanded subtree, like the original rail
|
|
78
|
+
// (zIndex 1 for the same paint-above-row-hover reason);
|
|
79
|
+
// - the LAST row's segment stops at the row's vertical centre where
|
|
80
|
+
// the foot meets it (`└`); for a branch that means half the
|
|
81
|
+
// branch-control only, so an expanded last branch hangs below the
|
|
82
|
+
// elbow with no rail running past it.
|
|
83
|
+
const foot = {
|
|
84
|
+
content: '""',
|
|
85
|
+
position: 'absolute',
|
|
86
|
+
insetBlockStart: '50%',
|
|
87
|
+
insetInlineStart: ROW_RAIL_COLUMN,
|
|
88
|
+
width: footLength,
|
|
89
|
+
height: '1px',
|
|
90
|
+
bg: guideColor,
|
|
91
|
+
} as const;
|
|
92
|
+
const rail = {
|
|
93
|
+
content: '""',
|
|
94
|
+
position: 'absolute',
|
|
95
|
+
insetBlockStart: '0',
|
|
96
|
+
insetInlineStart: ROW_RAIL_COLUMN,
|
|
97
|
+
width: '1px',
|
|
98
|
+
bg: guideColor,
|
|
99
|
+
} as const;
|
|
100
|
+
const elbowCss = elbow
|
|
101
|
+
? {
|
|
102
|
+
'& ~ [data-part="item"]': {
|
|
103
|
+
...ELBOW_INDENT_VARS,
|
|
104
|
+
...ELBOW_OFFSET_VARS,
|
|
105
|
+
},
|
|
106
|
+
// branch-control reads --tree-elbow-indentation by inheritance,
|
|
107
|
+
// but the offset override must sit on the control itself.
|
|
108
|
+
'& ~ [data-part="branch"]': ELBOW_INDENT_VARS,
|
|
109
|
+
'& ~ [data-part="branch"] > [data-part="branch-control"]':
|
|
110
|
+
ELBOW_OFFSET_VARS,
|
|
111
|
+
'& ~ [data-part="item"]::before': foot,
|
|
112
|
+
'& ~ [data-part="branch"] > [data-part="branch-control"]::before':
|
|
113
|
+
foot,
|
|
114
|
+
'& ~ [data-part="item"]:not(:last-child)::after': {
|
|
115
|
+
...rail,
|
|
116
|
+
insetBlockEnd: '0',
|
|
117
|
+
},
|
|
118
|
+
'& ~ [data-part="item"]:last-child::after': {
|
|
119
|
+
...rail,
|
|
120
|
+
height: '50%',
|
|
121
|
+
},
|
|
122
|
+
'& ~ [data-part="branch"]:not(:last-child)::before': {
|
|
123
|
+
...rail,
|
|
124
|
+
insetBlockEnd: '0',
|
|
125
|
+
insetInlineStart: BRANCH_RAIL_COLUMN,
|
|
126
|
+
zIndex: 1,
|
|
127
|
+
},
|
|
128
|
+
'& ~ [data-part="branch"]:last-child > [data-part="branch-control"]::after':
|
|
129
|
+
{
|
|
130
|
+
...rail,
|
|
131
|
+
height: '50%',
|
|
132
|
+
},
|
|
133
|
+
}
|
|
134
|
+
: undefined;
|
|
135
|
+
|
|
136
|
+
return (
|
|
137
|
+
<ChakraTreeView.BranchIndentGuide
|
|
138
|
+
ref={ref}
|
|
139
|
+
bg={elbow ? 'transparent' : guideColor}
|
|
140
|
+
css={elbowCss}
|
|
141
|
+
{...props}
|
|
142
|
+
/>
|
|
143
|
+
);
|
|
144
|
+
}
|
|
145
|
+
);
|
|
20
146
|
TreeBranchIndentGuide.displayName = 'TreeBranchIndentGuide';
|
|
@@ -23,7 +23,11 @@ export const Link = forwardRef<HTMLAnchorElement, LinkCustomProps>(
|
|
|
23
23
|
return (
|
|
24
24
|
<ChakraLink
|
|
25
25
|
ref={ref}
|
|
26
|
-
|
|
26
|
+
// Inherit the surrounding text weight so an inline link reads as part of
|
|
27
|
+
// its sentence (extrabold inside an H1, body weight inside a paragraph)
|
|
28
|
+
// rather than a fixed-semibold patch. Color + underline carry the link
|
|
29
|
+
// affordance. Override with an explicit `fontWeight` when needed.
|
|
30
|
+
fontWeight="inherit"
|
|
27
31
|
wordBreak="keep-all"
|
|
28
32
|
color={linkColor}
|
|
29
33
|
_hover={{
|
package/src/index.ts
CHANGED
|
@@ -53,7 +53,6 @@ export * from './components/LogicianProvider';
|
|
|
53
53
|
export * from './components/Markdown';
|
|
54
54
|
export * from './components/Masonry';
|
|
55
55
|
export * from './components/MaxLengthIndicator';
|
|
56
|
-
export * from './components/MDXEditor';
|
|
57
56
|
export * from './components/Menu';
|
|
58
57
|
export * from './components/Modal';
|
|
59
58
|
export * from './components/MonthPicker';
|
package/src/theme/global.ts
CHANGED
|
@@ -26,7 +26,10 @@ export const globalCss = defineGlobalStyles({
|
|
|
26
26
|
|
|
27
27
|
html: {
|
|
28
28
|
height: 'var(--chakra-vh)',
|
|
29
|
-
|
|
29
|
+
// Global base font size. The whole type/spacing scale is em-relative, so
|
|
30
|
+
// this single value drives the app-wide baseline; surfaces that need a
|
|
31
|
+
// different base (e.g. FactChat chat at 16px) opt in via <ScaledContext>.
|
|
32
|
+
fontSize: 14,
|
|
30
33
|
fontFamily: [
|
|
31
34
|
pretendard.style.fontFamily,
|
|
32
35
|
inter.style.fontFamily,
|
package/src/theme/index.ts
CHANGED
|
@@ -18,21 +18,25 @@ const SHARED_TEXT_STYLE_VALUES = {
|
|
|
18
18
|
h1: {
|
|
19
19
|
fontFamily: 'heading',
|
|
20
20
|
fontSize: { base: '2.4em', md: '3em' }, // 38.4px → 48px
|
|
21
|
-
|
|
21
|
+
// Display sizes carry the heaviest weight; the tight negative tracking
|
|
22
|
+
// above keeps extrabold from reading loose at 48px.
|
|
23
|
+
fontWeight: 'extrabold',
|
|
22
24
|
lineHeight: '1.33',
|
|
23
25
|
letterSpacing: '-0.02em',
|
|
24
26
|
},
|
|
25
27
|
h2: {
|
|
26
28
|
fontFamily: 'heading',
|
|
27
29
|
fontSize: { base: '2em', md: '2.5em' }, // 32px → 40px
|
|
28
|
-
fontWeight: '
|
|
30
|
+
fontWeight: 'extrabold',
|
|
29
31
|
lineHeight: '1.33',
|
|
30
32
|
letterSpacing: '-0.01em',
|
|
31
33
|
},
|
|
32
34
|
h3: {
|
|
33
35
|
fontFamily: 'heading',
|
|
34
36
|
fontSize: { base: '1.5em', md: '1.75em' }, // 24px → 28px
|
|
35
|
-
|
|
37
|
+
// Steps down to bold — the weight ramp tapers as size shrinks so heavy
|
|
38
|
+
// display weights don't muddy the smaller headings (h4/h5 stay lighter).
|
|
39
|
+
fontWeight: 'bold',
|
|
36
40
|
lineHeight: '1.33',
|
|
37
41
|
letterSpacing: '-0.01em',
|
|
38
42
|
},
|
|
@@ -74,7 +78,7 @@ const SHARED_TEXT_STYLE_VALUES = {
|
|
|
74
78
|
* Text styles for consistent typography across the application
|
|
75
79
|
* Names match fontSize tokens for easy migration: fontStyle="h1" → textStyle="h1"
|
|
76
80
|
*
|
|
77
|
-
* Base font size:
|
|
81
|
+
* Base font size: 14px (set in global.ts)
|
|
78
82
|
* Responsive scaling using em units (relative to nearest ancestor font-size):
|
|
79
83
|
* - Mobile (base): Slightly smaller for better readability on small screens
|
|
80
84
|
* - Desktop (md+): Original design sizes
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { MDXEditorMethods, MDXEditorProps as BaseEditorProps } from '@mdxeditor/editor';
|
|
2
|
-
import '@mdxeditor/editor/style.css';
|
|
3
|
-
import './MDXEditor.css';
|
|
4
|
-
import type { MDXEditorProps } from './MDXEditor.types';
|
|
5
|
-
export declare const MDXEditor: import("react").ForwardRefExoticComponent<MDXEditorProps & import("react").RefAttributes<BaseEditorProps & MDXEditorMethods>>;
|
|
6
|
-
//# sourceMappingURL=MDXEditor.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MDXEditor.d.ts","sourceRoot":"","sources":["../../../src/components/MDXEditor/MDXEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,EAeL,gBAAgB,EAChB,cAAc,IAAI,eAAe,EAOlC,MAAM,mBAAmB,CAAC;AAE3B,OAAO,6BAA6B,CAAC;AACrC,OAAO,iBAAiB,CAAC;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAExD,eAAO,MAAM,SAAS,+HA4SpB,CAAC"}
|
|
@@ -1,237 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var React = require('react');
|
|
6
|
-
var react = require('@chakra-ui/react');
|
|
7
|
-
var editor = require('@mdxeditor/editor');
|
|
8
|
-
require('@mdxeditor/editor/style.css');
|
|
9
|
-
|
|
10
|
-
const MDXEditor = React.forwardRef(({ containerProps, autoFocus = true, onError, ...rest }, ref) => {
|
|
11
|
-
const [error, setError] = React.useState(null);
|
|
12
|
-
// Resolve theme tokens to actual values
|
|
13
|
-
const [space1, space2, space4] = react.useToken('spacing', ['1', '2', '4']);
|
|
14
|
-
const [radiusSm] = react.useToken('radii', ['sm']);
|
|
15
|
-
// 내부적으로 Editor 인스턴스를 참조하기 위한 로컬 ref
|
|
16
|
-
const editorRef = React.useRef(null);
|
|
17
|
-
// 부모 컴포넌트로 전달된 ref가 editorRef를 바라보도록 연결
|
|
18
|
-
React.useImperativeHandle(ref, () => editorRef.current, []);
|
|
19
|
-
const handleContainerClick = (e) => {
|
|
20
|
-
// Only focus if clicking on the container itself, not on toolbar and table elements
|
|
21
|
-
const target = e.target;
|
|
22
|
-
const isToolbarClick = target.closest('.mdxeditor-toolbar');
|
|
23
|
-
const isTableClick = target.closest('table');
|
|
24
|
-
const isPopupClick = target.closest('.mdxeditor-popup-container');
|
|
25
|
-
if (!isToolbarClick && !isTableClick && !isPopupClick) {
|
|
26
|
-
editorRef.current?.focus();
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
return (jsxRuntime.jsx(react.Box, { width: "100%", height: "100%", borderWidth: "1px", borderRadius: "lg", overflow: "hidden", onClick: handleContainerClick, cursor: "text", ...containerProps, css: {
|
|
30
|
-
/**
|
|
31
|
-
* Chakra v3 css prop styling notes:
|
|
32
|
-
*
|
|
33
|
-
* 1. All nested selectors require '&' prefix (e.g., '& .class', '& h1')
|
|
34
|
-
* 2. Use full CSS property names (background, padding) instead of Chakra
|
|
35
|
-
* shorthand props (bg, p) in nested selectors
|
|
36
|
-
* 3. Color values must be resolved via useToken(), not token strings
|
|
37
|
-
* 4. Font sizes use responsive objects: { base: '2.4em', md: '3em' }
|
|
38
|
-
* 5. List styles must be explicitly defined (listStyleType, etc.)
|
|
39
|
-
*
|
|
40
|
-
* These requirements differ from v2's sx prop, which was more implicit.
|
|
41
|
-
* v3 prioritizes performance and explicitness over automatic handling.
|
|
42
|
-
*/
|
|
43
|
-
...containerProps?.css,
|
|
44
|
-
'& .mdxeditor': {
|
|
45
|
-
width: '100%',
|
|
46
|
-
minHeight: '300px',
|
|
47
|
-
height: '100%',
|
|
48
|
-
background: 'var(--chakra-colors-bg-surface)',
|
|
49
|
-
display: 'flex',
|
|
50
|
-
flexDirection: 'column',
|
|
51
|
-
},
|
|
52
|
-
'& .mdxeditor-toolbar': {
|
|
53
|
-
display: 'flex',
|
|
54
|
-
gap: space2,
|
|
55
|
-
padding: space2,
|
|
56
|
-
borderBottomWidth: '1px',
|
|
57
|
-
background: 'var(--chakra-colors-bg-subtle)',
|
|
58
|
-
flexShrink: 0,
|
|
59
|
-
cursor: 'default',
|
|
60
|
-
},
|
|
61
|
-
// Toolbar icons. mdxeditor colors its toolbar svgs with its own
|
|
62
|
-
// `--baseTextContrast` (its internal slate scale), which doesn't follow
|
|
63
|
-
// our color mode — in dark mode they stay near-black (#1c2024) and all
|
|
64
|
-
// but vanish against the dark toolbar. Flip them onto the semantic
|
|
65
|
-
// foreground token so they track light/dark like the editor body text.
|
|
66
|
-
'& .mdxeditor-toolbar svg': {
|
|
67
|
-
color: 'var(--chakra-colors-fg-default)',
|
|
68
|
-
},
|
|
69
|
-
// Disabled toolbar buttons (e.g. undo/redo with nothing to undo) — keep
|
|
70
|
-
// them dimmed but still mode-aware, instead of mdxeditor's light-only
|
|
71
|
-
// border color.
|
|
72
|
-
'& .mdxeditor-toolbar [data-disabled] svg': {
|
|
73
|
-
color: 'var(--chakra-colors-fg-subtle)',
|
|
74
|
-
},
|
|
75
|
-
// Hover / pressed / toggled-on backgrounds. mdxeditor paints these with
|
|
76
|
-
// `--baseBgActive` (its slate scale), which also doesn't track the color
|
|
77
|
-
// mode — in dark mode it goes light-grey, so the now-light icons sit on a
|
|
78
|
-
// light fill and disappear on hover and when a format is active. Flip the
|
|
79
|
-
// fill onto the semantic hover token so it stays mode-aware.
|
|
80
|
-
'& .mdxeditor-toolbar button:hover, & .mdxeditor-toolbar button[data-state="on"], & .mdxeditor-toolbar button:active': {
|
|
81
|
-
background: 'var(--chakra-colors-bg-muted)',
|
|
82
|
-
},
|
|
83
|
-
// Block-type select trigger in the toolbar — mdxeditor themes it with
|
|
84
|
-
// its own vars (left white), so flip it onto the semantic surface.
|
|
85
|
-
'& [class*="_selectTrigger_"]': {
|
|
86
|
-
background: 'var(--chakra-colors-bg-surface)',
|
|
87
|
-
color: 'var(--chakra-colors-fg-default)',
|
|
88
|
-
},
|
|
89
|
-
// Target the root contenteditable wrapper
|
|
90
|
-
'& [class*="_rootContentEditableWrapper_"]': {
|
|
91
|
-
flex: 1,
|
|
92
|
-
display: 'flex',
|
|
93
|
-
flexDirection: 'column',
|
|
94
|
-
minHeight: 0,
|
|
95
|
-
height: '100%',
|
|
96
|
-
overflow: 'auto',
|
|
97
|
-
},
|
|
98
|
-
// Target the actual contenteditable element
|
|
99
|
-
'& [contenteditable="true"]': {
|
|
100
|
-
flex: 1,
|
|
101
|
-
minHeight: '100%',
|
|
102
|
-
outline: 'none',
|
|
103
|
-
},
|
|
104
|
-
// Target any intermediate wrapper elements
|
|
105
|
-
'& [class*="_contentEditable_"]': {
|
|
106
|
-
flex: 1,
|
|
107
|
-
display: 'flex',
|
|
108
|
-
flexDirection: 'column',
|
|
109
|
-
},
|
|
110
|
-
'& .content-editable': {
|
|
111
|
-
padding: space4,
|
|
112
|
-
color: 'var(--chakra-colors-fg-default)',
|
|
113
|
-
display: 'flex',
|
|
114
|
-
flexDirection: 'column',
|
|
115
|
-
gap: radiusSm,
|
|
116
|
-
flex: 1,
|
|
117
|
-
height: '100%',
|
|
118
|
-
'& h1, & h2, & h3, & h4, & h5': {
|
|
119
|
-
marginBottom: '2px',
|
|
120
|
-
fontWeight: 'bold',
|
|
121
|
-
},
|
|
122
|
-
'& h1:not(:first-child), & h2:not(:first-child), & h3:not(:first-child), & h4:not(:first-child)': {
|
|
123
|
-
marginTop: space1,
|
|
124
|
-
},
|
|
125
|
-
/**
|
|
126
|
-
* Font sizes - Cannot be tokenized due to responsive objects
|
|
127
|
-
*
|
|
128
|
-
* Unlike spacing/radii/colors, fontSize values here are responsive objects
|
|
129
|
-
* { base: '2.4em', md: '3em' } which cannot be stored as regular tokens
|
|
130
|
-
* in Chakra v3. Only textStyles support responsive values, but we cannot
|
|
131
|
-
* extract just the fontSize from textStyles using useToken().
|
|
132
|
-
*
|
|
133
|
-
* These values match theme/index.ts textStyles exactly and must be
|
|
134
|
-
* manually synchronized when updating the theme:
|
|
135
|
-
* - h1: { base: '2.4em', md: '3em' }
|
|
136
|
-
* - h2: { base: '2em', md: '2.5em' }
|
|
137
|
-
* - h3: { base: '1.5em', md: '1.75em' }
|
|
138
|
-
* - h4: { base: '1.25em', md: '1.44em' }
|
|
139
|
-
* - h5: { base: '1.1em', md: '1.2em' }
|
|
140
|
-
*/
|
|
141
|
-
'& h1': {
|
|
142
|
-
fontSize: { base: '2.4em', md: '3em' },
|
|
143
|
-
},
|
|
144
|
-
'& h2': {
|
|
145
|
-
fontSize: { base: '2em', md: '2.5em' },
|
|
146
|
-
},
|
|
147
|
-
'& h3': {
|
|
148
|
-
fontSize: { base: '1.5em', md: '1.75em' },
|
|
149
|
-
},
|
|
150
|
-
'& h4': {
|
|
151
|
-
fontSize: { base: '1.25em', md: '1.44em' },
|
|
152
|
-
},
|
|
153
|
-
'& h5': {
|
|
154
|
-
fontSize: { base: '1.1em', md: '1.2em' },
|
|
155
|
-
},
|
|
156
|
-
/**
|
|
157
|
-
* List styling - IMPORTANT: v3 requires explicit list-style properties
|
|
158
|
-
*
|
|
159
|
-
* In Chakra v2, the `sx` prop automatically preserved browser default list styles.
|
|
160
|
-
* In Chakra v3, the `css` prop is more explicit and performant, but requires
|
|
161
|
-
* manual specification of list styles to override MDXEditor's CSS resets.
|
|
162
|
-
*
|
|
163
|
-
* Required properties:
|
|
164
|
-
* - listStyleType: 'disc' (ul) or 'decimal' (ol) - Shows bullets/numbers
|
|
165
|
-
* - listStylePosition: 'outside' - Places markers outside content box
|
|
166
|
-
* - display: 'list-item' (on li) - Ensures proper list item rendering
|
|
167
|
-
*
|
|
168
|
-
* Why this changed: v3 optimized for speed by removing automatic style inference,
|
|
169
|
-
* requiring more explicit style declarations.
|
|
170
|
-
*/
|
|
171
|
-
'& ul': {
|
|
172
|
-
marginTop: space2,
|
|
173
|
-
paddingInlineStart: space4,
|
|
174
|
-
listStyleType: 'disc',
|
|
175
|
-
listStylePosition: 'outside',
|
|
176
|
-
},
|
|
177
|
-
'& ol': {
|
|
178
|
-
marginTop: space2,
|
|
179
|
-
paddingInlineStart: space4,
|
|
180
|
-
listStyleType: 'decimal',
|
|
181
|
-
listStylePosition: 'outside',
|
|
182
|
-
},
|
|
183
|
-
'& li': {
|
|
184
|
-
lineHeight: '1.5',
|
|
185
|
-
marginBottom: space2,
|
|
186
|
-
display: 'list-item',
|
|
187
|
-
},
|
|
188
|
-
'& blockquote': {
|
|
189
|
-
borderLeftWidth: '4px',
|
|
190
|
-
borderLeftColor: 'var(--chakra-colors-primary-light)',
|
|
191
|
-
background: 'var(--chakra-colors-primary-lighter)',
|
|
192
|
-
paddingLeft: space4,
|
|
193
|
-
paddingBlock: space2,
|
|
194
|
-
marginBlock: space4,
|
|
195
|
-
color: 'var(--chakra-colors-fg-muted)',
|
|
196
|
-
},
|
|
197
|
-
'& a': {
|
|
198
|
-
color: 'var(--chakra-colors-primary-main)',
|
|
199
|
-
textDecoration: 'underline',
|
|
200
|
-
},
|
|
201
|
-
'& code': {
|
|
202
|
-
fontFamily: 'mono',
|
|
203
|
-
background: 'var(--chakra-colors-bg-muted)',
|
|
204
|
-
paddingInline: space1,
|
|
205
|
-
borderRadius: radiusSm,
|
|
206
|
-
'& span': {
|
|
207
|
-
background: 'transparent',
|
|
208
|
-
},
|
|
209
|
-
},
|
|
210
|
-
},
|
|
211
|
-
'& .mdxeditor-diff-source-wrapper': {
|
|
212
|
-
overflow: 'auto',
|
|
213
|
-
},
|
|
214
|
-
}, children: jsxRuntime.jsx(editor.MDXEditor, { ref: editorRef, contentEditableClassName: "content-editable", overlayContainer: typeof document !== 'undefined' ? document.body : undefined, autoFocus: autoFocus, onError: ({ error }) => {
|
|
215
|
-
setError(error);
|
|
216
|
-
onError?.(error);
|
|
217
|
-
}, plugins: [
|
|
218
|
-
editor.headingsPlugin({
|
|
219
|
-
allowedHeadingLevels: [2, 3, 4, 5],
|
|
220
|
-
}),
|
|
221
|
-
editor.linkPlugin(),
|
|
222
|
-
editor.listsPlugin(),
|
|
223
|
-
editor.imagePlugin(),
|
|
224
|
-
editor.quotePlugin(),
|
|
225
|
-
editor.thematicBreakPlugin(),
|
|
226
|
-
editor.markdownShortcutPlugin(),
|
|
227
|
-
editor.tablePlugin(),
|
|
228
|
-
editor.diffSourcePlugin(),
|
|
229
|
-
editor.toolbarPlugin({
|
|
230
|
-
toolbarContents: () => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(editor.UndoRedo, {}), jsxRuntime.jsx(editor.Separator, {}), jsxRuntime.jsx(editor.BoldItalicUnderlineToggles, {}), jsxRuntime.jsx(editor.CodeToggle, {}), jsxRuntime.jsx(editor.Separator, {}), jsxRuntime.jsx(editor.ListsToggle, {}), jsxRuntime.jsx(editor.Separator, {}), jsxRuntime.jsx(editor.BlockTypeSelect, {}), jsxRuntime.jsx(editor.Separator, {}), jsxRuntime.jsx(editor.InsertTable, {}), jsxRuntime.jsx(editor.InsertThematicBreak, {}), error && (jsxRuntime.jsx(editor.DiffSourceToggleWrapper, { options: ['rich-text', 'source'], children: jsxRuntime.jsx(jsxRuntime.Fragment, {}) }))] })),
|
|
231
|
-
}),
|
|
232
|
-
], ...rest }) }));
|
|
233
|
-
});
|
|
234
|
-
MDXEditor.displayName = 'MDXEditor';
|
|
235
|
-
|
|
236
|
-
exports.MDXEditor = MDXEditor;
|
|
237
|
-
//# sourceMappingURL=MDXEditor.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MDXEditor.js","sources":["../../../src/components/MDXEditor/MDXEditor.tsx"],"sourcesContent":[null],"names":["forwardRef","useState","useToken","useRef","useImperativeHandle","_jsx","Box","Editor","headingsPlugin","linkPlugin","listsPlugin","imagePlugin","quotePlugin","thematicBreakPlugin","markdownShortcutPlugin","tablePlugin","diffSourcePlugin","toolbarPlugin","_jsxs","_Fragment","UndoRedo","Separator","BoldItalicUnderlineToggles","CodeToggle","ListsToggle","BlockTypeSelect","InsertTable","InsertThematicBreak","DiffSourceToggleWrapper"],"mappings":"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"}
|