@lax-wp/design-system 0.9.11 → 0.9.13
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/forms/md-input/MarkdownPreview.d.ts +4 -0
- package/dist/components/forms/md-input/RichMarkdownInput.d.ts +27 -10
- package/dist/index.es.js +4348 -4259
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +38 -38
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
|
@@ -10,6 +10,8 @@ export interface MarkdownPreviewProps {
|
|
|
10
10
|
linkTarget?: '_blank' | '_self';
|
|
11
11
|
/** Whether to show syntax highlighting for code blocks */
|
|
12
12
|
enableSyntaxHighlighting?: boolean;
|
|
13
|
+
/** Whether to remove indentation from lists and align all content to the left */
|
|
14
|
+
noIndent?: boolean;
|
|
13
15
|
}
|
|
14
16
|
/**
|
|
15
17
|
* MarkdownPreview component displays rendered markdown content.
|
|
@@ -33,12 +35,14 @@ export interface MarkdownPreviewProps {
|
|
|
33
35
|
* - Responsive images
|
|
34
36
|
* - Dark mode support
|
|
35
37
|
* - Configurable link behavior
|
|
38
|
+
* - Optional no-indent mode for aligned content
|
|
36
39
|
*
|
|
37
40
|
* @example
|
|
38
41
|
* ```tsx
|
|
39
42
|
* <MarkdownPreview
|
|
40
43
|
* content="# Hello World\n\nThis is **bold** text."
|
|
41
44
|
* linkTarget="_blank"
|
|
45
|
+
* noIndent={false}
|
|
42
46
|
* />
|
|
43
47
|
* ```
|
|
44
48
|
*/
|
|
@@ -6,6 +6,8 @@ export interface RichMarkdownInputProps {
|
|
|
6
6
|
id?: string;
|
|
7
7
|
/** Current markdown value */
|
|
8
8
|
value?: string;
|
|
9
|
+
/** Default value for the input */
|
|
10
|
+
defaultValue?: string;
|
|
9
11
|
/** Placeholder text for the textarea */
|
|
10
12
|
placeholder?: string;
|
|
11
13
|
/** Minimum number of visible text lines */
|
|
@@ -30,6 +32,22 @@ export interface RichMarkdownInputProps {
|
|
|
30
32
|
maxLength?: number;
|
|
31
33
|
/** Link target behavior: '_blank' for new tab, '_self' for current tab */
|
|
32
34
|
linkTarget?: '_blank' | '_self';
|
|
35
|
+
/** Error message to display */
|
|
36
|
+
errorMessage?: string;
|
|
37
|
+
/** Tooltip text */
|
|
38
|
+
tooltip?: string;
|
|
39
|
+
/** Whether to preserve original case (no auto-lowercase) */
|
|
40
|
+
originalCase?: boolean;
|
|
41
|
+
/** Icon to display at the end of the input */
|
|
42
|
+
suffixIcon?: React.ReactNode;
|
|
43
|
+
/** Whether the input is clearable */
|
|
44
|
+
isClearable?: boolean;
|
|
45
|
+
/** Ref for the input element */
|
|
46
|
+
inputref?: React.RefObject<HTMLTextAreaElement>;
|
|
47
|
+
/** Keyboard event handler */
|
|
48
|
+
onKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
|
|
49
|
+
/** Whether to remove indentation from lists and align all content to the left in preview */
|
|
50
|
+
noIndent?: boolean;
|
|
33
51
|
/** Callback function called when the markdown value changes */
|
|
34
52
|
onChange: (value: string) => void;
|
|
35
53
|
}
|
|
@@ -40,29 +58,25 @@ export interface RichMarkdownInputProps {
|
|
|
40
58
|
* - Bold (Ctrl+B) - Always visible
|
|
41
59
|
* - Italic (Ctrl+I) - Always visible
|
|
42
60
|
* - Underline (Ctrl+U) - Always visible
|
|
43
|
-
* - Strikethrough - Hidden on mobile (< 640px)
|
|
44
61
|
*
|
|
45
62
|
* **Lists:**
|
|
46
63
|
* - Bullet lists - Always visible
|
|
47
64
|
* - Numbered lists - Always visible
|
|
48
65
|
*
|
|
49
|
-
* **Additional:**
|
|
50
|
-
* - Inline code (Ctrl+E) - Hidden on small screens (< 1024px)
|
|
51
|
-
* - Block quotes - Hidden on medium screens (< 1280px)
|
|
52
|
-
* - Headings - Hidden on small screens (< 1024px)
|
|
53
|
-
* - Links (Ctrl+K) - Hidden on medium screens (< 1280px)
|
|
54
|
-
* - Images - Supported in preview
|
|
55
|
-
* - Horizontal rules - Hidden on large screens (< 1536px)
|
|
56
|
-
*
|
|
57
66
|
* **Features:**
|
|
58
67
|
* - Edit/Preview toggle with icons
|
|
59
68
|
* - Character counter (optional)
|
|
60
69
|
* - Preview modal with scrolling
|
|
61
70
|
* - Keyboard shortcuts
|
|
62
71
|
* - Syntax highlighting for code blocks
|
|
63
|
-
* - Responsive toolbar
|
|
72
|
+
* - Responsive toolbar
|
|
64
73
|
* - Dark mode support
|
|
65
74
|
* - Configurable link target behavior
|
|
75
|
+
* - Error message display
|
|
76
|
+
* - Tooltip support
|
|
77
|
+
* - Clear button (optional)
|
|
78
|
+
* - Suffix icon support
|
|
79
|
+
* - Custom keyboard handlers
|
|
66
80
|
*
|
|
67
81
|
* @example
|
|
68
82
|
* ```tsx
|
|
@@ -73,6 +87,9 @@ export interface RichMarkdownInputProps {
|
|
|
73
87
|
* label="Description"
|
|
74
88
|
* maxLength={300}
|
|
75
89
|
* linkTarget="_blank"
|
|
90
|
+
* isClearable
|
|
91
|
+
* errorMessage="Invalid input"
|
|
92
|
+
* tooltip="Use markdown formatting"
|
|
76
93
|
* />
|
|
77
94
|
* ```
|
|
78
95
|
*/
|