@mks2508/mks-ui 0.8.2 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react-ui/blocks/Terminal/TerminalPanel.js +1 -1
- package/dist/react-ui/blocks/Terminal/display.js +4 -4
- package/dist/react-ui/blocks/Terminal/index.d.ts +16 -28
- package/dist/react-ui/blocks/Terminal/index.d.ts.map +1 -1
- package/dist/react-ui/blocks/Terminal/index.js +2 -23
- package/dist/react-ui/blocks/Terminal/interactive.d.ts +18 -0
- package/dist/react-ui/blocks/Terminal/interactive.d.ts.map +1 -0
- package/dist/react-ui/blocks/Terminal/interactive.js +3 -0
- package/dist/react-ui/blocks/Terminal/panel/TerminalInteractivePanelRestty.js +2 -2
- package/dist/react-ui/blocks/Terminal/panel/TerminalInteractivePanelXterm.js +1 -1
- package/dist/react-ui/blocks/Terminal/panel/TerminalLogsPanel/index.js +2 -2
- package/dist/react-ui/blocks/Terminal/restty/ResttyTerminal.js +1 -1
- package/dist/react-ui/blocks/Terminal/restty.d.ts +27 -0
- package/dist/react-ui/blocks/Terminal/restty.d.ts.map +1 -0
- package/dist/react-ui/blocks/Terminal/restty.js +12 -0
- package/dist/react-ui/blocks/Terminal/wterm.d.ts +20 -0
- package/dist/react-ui/blocks/Terminal/wterm.d.ts.map +1 -0
- package/dist/react-ui/blocks/Terminal/wterm.js +4 -0
- package/dist/react-ui/blocks/Terminal/xterm.d.ts +26 -0
- package/dist/react-ui/blocks/Terminal/xterm.d.ts.map +1 -0
- package/dist/react-ui/blocks/Terminal/xterm.js +9 -0
- package/dist/react-ui/index.d.ts +2 -2
- package/dist/react-ui/index.d.ts.map +1 -1
- package/dist/react-ui/index.js +5 -7
- package/dist/react-ui/ui/MiddleTruncate/MiddleTruncate.styles.d.ts +30 -0
- package/dist/react-ui/ui/MiddleTruncate/MiddleTruncate.styles.d.ts.map +1 -0
- package/dist/react-ui/ui/MiddleTruncate/MiddleTruncate.styles.js +31 -0
- package/dist/react-ui/ui/MiddleTruncate/MiddleTruncate.types.d.ts +66 -0
- package/dist/react-ui/ui/MiddleTruncate/MiddleTruncate.types.d.ts.map +1 -0
- package/dist/react-ui/ui/MiddleTruncate/index.d.ts +79 -0
- package/dist/react-ui/ui/MiddleTruncate/index.d.ts.map +1 -0
- package/dist/react-ui/ui/MiddleTruncate/index.js +164 -0
- package/dist/react-ui/ui/MiddleTruncatePath/MiddleTruncatePath.styles.js +1 -1
- package/dist/react-ui/ui/MiddleTruncatePath/index.d.ts +7 -1
- package/dist/react-ui/ui/MiddleTruncatePath/index.d.ts.map +1 -1
- package/dist/react-ui/ui/MiddleTruncatePath/index.js +21 -17
- package/dist/react-ui/ui/index.d.ts +1 -0
- package/dist/react-ui/ui/index.d.ts.map +1 -1
- package/dist/react-ui/ui/index.js +3 -1
- package/package.json +21 -1
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
import { TerminalIcon } from "../../icons/lucide-animated/terminal.js";
|
|
4
4
|
import "../../icons/lucide-animated/index.js";
|
|
5
|
-
import { XTermWrapper } from "./TerminalXterm.js";
|
|
6
5
|
import { getTerminalTheme } from "./Terminal.theme.js";
|
|
6
|
+
import { XTermWrapper } from "./TerminalXterm.js";
|
|
7
7
|
import { useCallback, useEffect, useRef, useState } from "react";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { SYNTHWAVE_TERMINAL_THEME, getTerminalTheme } from "./Terminal.theme.js";
|
|
2
1
|
import { ACCENT_GRADIENTS, terminalChromeStyles, terminalChromeVariants } from "./panel/TerminalPanelChrome.styles.js";
|
|
3
2
|
import { NOISE_TEXTURE_SVG, TerminalPanelChrome, terminalScrollStyles } from "./panel/TerminalPanelChrome.js";
|
|
4
|
-
import {
|
|
3
|
+
import { SYNTHWAVE_TERMINAL_THEME, getTerminalTheme } from "./Terminal.theme.js";
|
|
5
4
|
import { getSynthwaveGhosttyTheme, hexToResttyColor, xtermThemeToGhostty } from "./Terminal.theme.restty.js";
|
|
6
|
-
import { ResttyTerminal } from "./restty/ResttyTerminal.js";
|
|
7
|
-
import "./restty/index.js";
|
|
8
5
|
import { terminalDisplayStyles, terminalDisplayVariants } from "./TerminalDisplay.styles.js";
|
|
9
6
|
import { TerminalDisplay } from "./TerminalDisplay.js";
|
|
7
|
+
import { ResttySessionProvider, useResttySession } from "./restty/ResttySessionProvider.js";
|
|
8
|
+
import { ResttyTerminal } from "./restty/ResttyTerminal.js";
|
|
9
|
+
import "./restty.js";
|
|
10
10
|
|
|
11
11
|
export { ACCENT_GRADIENTS, NOISE_TEXTURE_SVG, ResttySessionProvider, ResttyTerminal, SYNTHWAVE_TERMINAL_THEME, TerminalDisplay, TerminalPanelChrome, getSynthwaveGhosttyTheme, getTerminalTheme, hexToResttyColor, terminalChromeStyles, terminalChromeVariants, terminalDisplayStyles, terminalDisplayVariants, terminalScrollStyles, useResttySession, xtermThemeToGhostty };
|
|
@@ -1,47 +1,35 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Terminal Block barrel export.
|
|
2
|
+
* Terminal Block barrel export — agnostic surface only.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
4
|
+
* Components and utilities that DO NOT pull renderer peer deps
|
|
5
|
+
* (`@xterm/*`, `@wterm/*`, `@mks2508/restty`, `@tanstack/react-virtual`).
|
|
6
6
|
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
7
|
+
* For renderer-specific surfaces use the dedicated sub-entries:
|
|
8
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/xterm` → xterm.js panels + adapter + LogLinesViewer + TerminalLogsPanel + TerminalPanel
|
|
9
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/restty` → restty integration + TerminalThemeSelector + interactive panel
|
|
10
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/wterm` → wterm bridge + interactive panel
|
|
11
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/interactive` → renderer-router (lazy)
|
|
12
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/display` → readonly TerminalDisplay (restty)
|
|
13
|
+
* - `@mks2508/mks-ui/react/blocks/Terminal/chrome` → glassmorphism shell only
|
|
9
14
|
*
|
|
10
15
|
* @module @mks2508/mks-ui/react/blocks/Terminal
|
|
11
16
|
*/
|
|
12
|
-
export { TerminalPanel, type ITerminalPanelProps } from './TerminalPanel';
|
|
13
17
|
export * from './parsing';
|
|
14
18
|
export * from './components';
|
|
15
19
|
export { useTerminalWebSocket, type IUseTerminalWebSocketOptions, type IUseTerminalWebSocketReturn, type ITerminalWsServerMessage, type TTerminalWsStatus, useTerminalSettings, type ITerminalSettings, type IUseTerminalSettingsReturn, } from './hooks';
|
|
16
20
|
export { useTerminal, type IUseTerminalOptions, type IUseTerminalReturn, type ITerminalResttyProps, useTerminalConnection, type IUseTerminalConnectionOptions, type IUseTerminalConnectionReturn, useTerminalFontSize, type IUseTerminalFontSizeOptions, type IUseTerminalFontSizeReturn, useTerminalPaneManager, type IUseTerminalPaneManagerOptions, type IUseTerminalPaneManagerReturn, useTerminalDimensions, type IUseTerminalDimensionsReturn, type ITerminalDimensions, useTerminalKeyboardShortcuts, type ITerminalShortcutConfig, } from './hooks';
|
|
17
21
|
export { TerminalActionBar, terminalActionBarStyles, type ITerminalActionBarProps, type TerminalActionBarSlot, TerminalStatusBar, terminalStatusBarStyles, type ITerminalStatusBarProps, type TerminalStatusBarSlot, TerminalFontControls, terminalFontControlsStyles, type ITerminalFontControlsProps, type TerminalFontControlsSlot, TerminalSplitButton, terminalSplitButtonStyles, type ITerminalSplitButtonProps, type TerminalSplitButtonSlot, TerminalConnectionStatus, terminalConnectionStatusStyles, type ITerminalConnectionStatusProps, type TerminalConnectionStatusSlot, TerminalClearButton, TerminalReconnectButton, TerminalDimensionsBadge, TerminalRendererBadge, TerminalDisconnectedOverlay, type ITerminalClearButtonProps, type ITerminalReconnectButtonProps, type ITerminalDimensionsBadgeProps, type ITerminalRendererBadgeProps, type ITerminalDisconnectedOverlayProps, } from './controls';
|
|
18
|
-
export {
|
|
19
|
-
export {
|
|
20
|
-
export {
|
|
21
|
-
export { TerminalInteractivePanelWterm } from './panel/TerminalInteractivePanelWterm';
|
|
22
|
-
export { TerminalPanelChrome, NOISE_TEXTURE_SVG, terminalScrollStyles } from './panel/TerminalPanelChrome';
|
|
23
|
-
export { TerminalPanelHeader, terminalPanelHeaderStyles, type TerminalPanelHeaderSlot } from './panel/TerminalPanelHeader';
|
|
24
|
-
export { TerminalPanelFooter, terminalPanelFooterStyles, type TerminalPanelFooterSlot } from './panel/TerminalPanelFooter';
|
|
25
|
-
export { LogLinesViewer } from './panel/LogLinesViewer';
|
|
22
|
+
export { TerminalPanelChrome, NOISE_TEXTURE_SVG, terminalScrollStyles, } from './panel/TerminalPanelChrome';
|
|
23
|
+
export { TerminalPanelHeader, terminalPanelHeaderStyles, type TerminalPanelHeaderSlot, } from './panel/TerminalPanelHeader';
|
|
24
|
+
export { TerminalPanelFooter, terminalPanelFooterStyles, type TerminalPanelFooterSlot, } from './panel/TerminalPanelFooter';
|
|
26
25
|
export { TerminalSettingsPopover } from './panel/TerminalSettingsPopover';
|
|
27
|
-
export { TerminalThemeSelector } from './panel/TerminalThemeSelector';
|
|
28
|
-
export { ResttyTerminal, ResttySessionProvider, useResttySession, ResttyProvider, useRestty, useResttyPane, useResttyPanes, useResttyVisibility, useResttyPlugins, } from './restty';
|
|
29
|
-
export type { IResttyTerminalProps, IResttyTerminalRef, IResttySessionProviderProps, IResttySessionContextValue, IResttyContextValue, IUseResttyPaneReturn, IUseResttyPanesReturn, IUseResttyVisibilityOptions, IUseResttyPluginsReturn, Restty, ResttyPlugin, ResttyPluginInfo, ResttyPaneHandle, ResttyFontSource, ResttyPaneSplitDirection, GhosttyTheme, } from './restty';
|
|
30
26
|
export { LOG_LEVEL_STYLES, CONTENT_TYPE_STYLES, PRIMARY_GLOW, PRIMARY_GLOW_COMPOUND, STATUS_COLORS, TRAFFIC_LIGHT_STYLES, SEGMENTED_BUTTON_STYLES, TOGGLE_STYLES, ACTION_BUTTON_STYLES, FILTER_BUTTON_STYLES, TRIGGER_BUTTON_STYLES, FONT_BUTTON_STYLES, TERMINAL_BG, SECTION_LABEL_STYLES, TOGGLE_SWITCH_STYLES, type ILogLevelStyle, type IContentTypeStyle, type IStatusStyle, type TContentType, type TTerminalConnectionStatusToken, } from './Terminal.tokens';
|
|
31
27
|
export { SYNTHWAVE_TERMINAL_THEME, getTerminalTheme } from './Terminal.theme';
|
|
32
28
|
export { hexToResttyColor, xtermThemeToGhostty, getSynthwaveGhosttyTheme, type IResttyThemeColor, type IResttyGhosttyTheme, } from './Terminal.theme.restty';
|
|
33
|
-
export {
|
|
34
|
-
export { XTermWrapper, type IXTermWrapperProps, useTerminalSearch } from './TerminalXterm';
|
|
35
|
-
export { WtermJsonTransport } from './wterm/WtermJsonTransport';
|
|
29
|
+
export { terminalChromeStyles, terminalChromeVariants, ACCENT_GRADIENTS, type TerminalChromeSlot, type TerminalChromeVariantProps, } from './panel/TerminalPanelChrome.styles';
|
|
36
30
|
export type { ITerminalRendererType, ITerminalPtyBackendType, ITerminalBackendType, ITerminalMode, ITerminalConnectionStatus, ITerminalSession, ITerminalOptions, ITerminalTheme, ITerminalAdapter, ITerminalAdapterCapabilities, IPtyTransport, IPtyTransportFactory, IPtyTransportCallbacks, IPtyTransportConnectOptions, } from './Terminal.types';
|
|
37
31
|
export type { ITerminalPanelChromeProps } from './panel/TerminalPanelChrome.types';
|
|
38
|
-
export type { ITerminalInteractivePanelProps, ITerminalInteractivePanelRef } from './panel/TerminalInteractivePanel.types';
|
|
39
|
-
export type {
|
|
40
|
-
export type { ITerminalLogsPanelProps, ITerminalLogsPanelRef, ITerminalPanelHeaderProps, ITerminalPanelToolbarProps, ITerminalPanelFooterProps, ILevelFilterButton, TTerminalAction, } from './panel/TerminalLogsPanel.types';
|
|
41
|
-
export type { ILogLinesViewerProps } from './panel/LogLinesViewer';
|
|
32
|
+
export type { ITerminalInteractivePanelProps, ITerminalInteractivePanelRef, } from './panel/TerminalInteractivePanel.types';
|
|
33
|
+
export type { ITerminalPanelHeaderProps, ITerminalPanelToolbarProps, ITerminalPanelFooterProps, ILevelFilterButton, TTerminalAction, } from './panel/TerminalLogsPanel.types';
|
|
42
34
|
export type { TLogLevelFilter } from './parsing/LogParser.types';
|
|
43
|
-
export { TerminalDisplay } from './TerminalDisplay';
|
|
44
|
-
export type { ITerminalDisplayProps, ITerminalDisplayRef, TerminalDisplaySlot } from './TerminalDisplay.types';
|
|
45
|
-
export { terminalDisplayStyles, terminalDisplayVariants, type TerminalDisplayVariantProps } from './TerminalDisplay.styles';
|
|
46
|
-
export { terminalChromeStyles, terminalChromeVariants, ACCENT_GRADIENTS, type TerminalChromeSlot, type TerminalChromeVariantProps } from './panel/TerminalPanelChrome.styles';
|
|
47
35
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,cAAc,WAAW,CAAC;AAG1B,cAAc,cAAc,CAAC;AAG7B,OAAO,EACL,oBAAoB,EACpB,KAAK,4BAA4B,EACjC,KAAK,2BAA2B,EAChC,KAAK,wBAAwB,EAC7B,KAAK,iBAAiB,EACtB,mBAAmB,EACnB,KAAK,iBAAiB,EACtB,KAAK,0BAA0B,GAChC,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,WAAW,EACX,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,oBAAoB,EACzB,qBAAqB,EACrB,KAAK,6BAA6B,EAClC,KAAK,4BAA4B,EACjC,mBAAmB,EACnB,KAAK,2BAA2B,EAChC,KAAK,0BAA0B,EAC/B,sBAAsB,EACtB,KAAK,8BAA8B,EACnC,KAAK,6BAA6B,EAClC,qBAAqB,EACrB,KAAK,4BAA4B,EACjC,KAAK,mBAAmB,EACxB,4BAA4B,EAC5B,KAAK,uBAAuB,GAC7B,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,oBAAoB,EACpB,0BAA0B,EAC1B,KAAK,0BAA0B,EAC/B,KAAK,wBAAwB,EAC7B,mBAAmB,EACnB,yBAAyB,EACzB,KAAK,yBAAyB,EAC9B,KAAK,uBAAuB,EAC5B,wBAAwB,EACxB,8BAA8B,EAC9B,KAAK,8BAA8B,EACnC,KAAK,4BAA4B,EACjC,mBAAmB,EACnB,uBAAuB,EACvB,uBAAuB,EACvB,qBAAqB,EACrB,2BAA2B,EAC3B,KAAK,yBAAyB,EAC9B,KAAK,6BAA6B,EAClC,KAAK,6BAA6B,EAClC,KAAK,2BAA2B,EAChC,KAAK,iCAAiC,GACvC,MAAM,YAAY,CAAC;AAGpB,OAAO,EACL,mBAAmB,EACnB,iBAAiB,EACjB,oBAAoB,GACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,mBAAmB,EACnB,yBAAyB,EACzB,KAAK,uBAAuB,GAC7B,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,mBAAmB,EACnB,yBAAyB,EACzB,KAAK,uBAAuB,GAC7B,MAAM,6BAA6B,CAAC;AAGrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAG1E,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,oBAAoB,EACpB,uBAAuB,EACvB,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,kBAAkB,EAClB,WAAW,EACX,oBAAoB,EACpB,oBAAoB,EACpB,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACtB,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,8BAA8B,GACpC,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAG9E,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,wBAAwB,EACxB,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,GACzB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,gBAAgB,EAChB,KAAK,kBAAkB,EACvB,KAAK,0BAA0B,GAChC,MAAM,oCAAoC,CAAC;AAG5C,YAAY,EACV,qBAAqB,EACrB,uBAAuB,EACvB,oBAAoB,EACpB,aAAa,EACb,yBAAyB,EACzB,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,4BAA4B,EAC5B,aAAa,EACb,oBAAoB,EACpB,sBAAsB,EACtB,2BAA2B,GAC5B,MAAM,kBAAkB,CAAC;AAE1B,YAAY,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AACnF,YAAY,EACV,8BAA8B,EAC9B,4BAA4B,GAC7B,MAAM,wCAAwC,CAAC;AAChD,YAAY,EACV,yBAAyB,EACzB,0BAA0B,EAC1B,yBAAyB,EACzB,kBAAkB,EAClB,eAAe,GAChB,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC"}
|
|
@@ -1,6 +1,3 @@
|
|
|
1
|
-
import { XTermWrapper, useTerminalSearch } from "./TerminalXterm.js";
|
|
2
|
-
import { SYNTHWAVE_TERMINAL_THEME, getTerminalTheme } from "./Terminal.theme.js";
|
|
3
|
-
import { TerminalPanel } from "./TerminalPanel.js";
|
|
4
1
|
import { ANSI_COLOR_MAP, ANSI_INTRODUCERS, ANSI_MODIFIERS, ANSI_PATTERNS, LOG_LEVEL_ANSI_COLORS, SGR_CODES, SYNTHWAVE_ANSI_COLORS } from "./parsing/ansi/ansi.constants.js";
|
|
5
2
|
import { AnsiColorMapper } from "./parsing/ansi/AnsiColorMapper.js";
|
|
6
3
|
import { AnsiParser } from "./parsing/ansi/AnsiParser.js";
|
|
@@ -36,7 +33,6 @@ import { terminalFontControlsStyles } from "./controls/TerminalFontControls/Term
|
|
|
36
33
|
import { TerminalFontControls } from "./controls/TerminalFontControls/index.js";
|
|
37
34
|
import { terminalSplitButtonStyles } from "./controls/TerminalSplitButton/TerminalSplitButton.styles.js";
|
|
38
35
|
import { TerminalSplitButton } from "./controls/TerminalSplitButton/index.js";
|
|
39
|
-
import { TerminalThemeSelector } from "./panel/TerminalThemeSelector/index.js";
|
|
40
36
|
import { TerminalSettingsPopover } from "./panel/TerminalSettingsPopover/index.js";
|
|
41
37
|
import { TerminalActionBar } from "./controls/TerminalActionBar/index.js";
|
|
42
38
|
import { terminalStatusBarStyles } from "./controls/TerminalStatusBar/TerminalStatusBar.styles.js";
|
|
@@ -50,24 +46,7 @@ import { TerminalPanelHeader } from "./panel/TerminalPanelHeader/index.js";
|
|
|
50
46
|
import { NOISE_TEXTURE_SVG, TerminalPanelChrome, terminalScrollStyles } from "./panel/TerminalPanelChrome.js";
|
|
51
47
|
import { terminalPanelFooterStyles } from "./panel/TerminalPanelFooter/TerminalPanelFooter.styles.js";
|
|
52
48
|
import { TerminalPanelFooter } from "./panel/TerminalPanelFooter/index.js";
|
|
53
|
-
import {
|
|
54
|
-
import { terminalLogsPanelStyles } from "./panel/TerminalLogsPanel/TerminalLogsPanel.styles.js";
|
|
55
|
-
import { TerminalLogsPanel } from "./panel/TerminalLogsPanel/index.js";
|
|
56
|
-
import { TerminalInteractivePanel } from "./panel/TerminalInteractivePanel.js";
|
|
57
|
-
import { ResttyProvider, useRestty } from "./restty/ResttyContext.js";
|
|
58
|
-
import { ResttySessionProvider, useResttySession } from "./restty/ResttySessionProvider.js";
|
|
49
|
+
import { SYNTHWAVE_TERMINAL_THEME, getTerminalTheme } from "./Terminal.theme.js";
|
|
59
50
|
import { getSynthwaveGhosttyTheme, hexToResttyColor, xtermThemeToGhostty } from "./Terminal.theme.restty.js";
|
|
60
|
-
import { ResttyTerminal } from "./restty/ResttyTerminal.js";
|
|
61
|
-
import { useResttyPane } from "./restty/useResttyPane.js";
|
|
62
|
-
import { useResttyPanes } from "./restty/useResttyPanes.js";
|
|
63
|
-
import { useResttyVisibility } from "./restty/useResttyVisibility.js";
|
|
64
|
-
import { useResttyPlugins } from "./restty/useResttyPlugins.js";
|
|
65
|
-
import "./restty/index.js";
|
|
66
|
-
import { TerminalInteractivePanelRestty } from "./panel/TerminalInteractivePanelRestty.js";
|
|
67
|
-
import { WtermJsonTransport } from "./wterm/WtermJsonTransport.js";
|
|
68
|
-
import { TerminalInteractivePanelWterm } from "./panel/TerminalInteractivePanelWterm.js";
|
|
69
|
-
import { XTermAdapter } from "./XTermAdapter.js";
|
|
70
|
-
import { terminalDisplayStyles, terminalDisplayVariants } from "./TerminalDisplay.styles.js";
|
|
71
|
-
import { TerminalDisplay } from "./TerminalDisplay.js";
|
|
72
51
|
|
|
73
|
-
export { ACCENT_GRADIENTS, ACTION_BUTTON_STYLES, ANSI_COLOR_MAP, ANSI_INTRODUCERS, ANSI_MODIFIERS, ANSI_PATTERNS, AnsiColorMapper, AnsiParser, BadgeFormatter, CONTENT_TYPE_STYLES, ContentTypeBadge, DEFAULT_SYNTAX_THEME, FILTER_BUTTON_STYLES, FONT_BUTTON_STYLES, HighlightedJson, HttpLogParser, LOG_LEVEL_ANSI_COLORS, LOG_LEVEL_STYLES, LevelBadge, LogLevelDetector, LogLineContainer,
|
|
52
|
+
export { ACCENT_GRADIENTS, ACTION_BUTTON_STYLES, ANSI_COLOR_MAP, ANSI_INTRODUCERS, ANSI_MODIFIERS, ANSI_PATTERNS, AnsiColorMapper, AnsiParser, BadgeFormatter, CONTENT_TYPE_STYLES, ContentTypeBadge, DEFAULT_SYNTAX_THEME, FILTER_BUTTON_STYLES, FONT_BUTTON_STYLES, HighlightedJson, HttpLogParser, LOG_LEVEL_ANSI_COLORS, LOG_LEVEL_STYLES, LevelBadge, LogLevelDetector, LogLineContainer, LogParserService, MultilineAggregator, NOISE_TEXTURE_SVG, PRIMARY_GLOW, PRIMARY_GLOW_COMPOUND, PersistentLogBuffer, SECTION_LABEL_STYLES, SEGMENTED_BUTTON_STYLES, SGR_CODES, STATUS_COLORS, SYNTHWAVE_ANSI_COLORS, SYNTHWAVE_TERMINAL_THEME, SpecializedSyntaxHighlighter, SyntaxHighlightedText, SyntaxHighlighter, TABLE_CHARS, TERMINAL_BG, TOGGLE_STYLES, TOGGLE_SWITCH_STYLES, TRAFFIC_LIGHT_STYLES, TRIGGER_BUTTON_STYLES, TableParser, TagBadge, TagBadges, TerminalActionBar, TerminalClearButton, TerminalConnectionStatus, TerminalDimensionsBadge, TerminalDisconnectedOverlay, TerminalFontControls, TerminalLogBadge, TerminalPanelChrome, TerminalPanelFooter, TerminalPanelHeader, TerminalReconnectButton, TerminalRendererBadge, TerminalSettingsPopover, TerminalSplitButton, TerminalStatusBar, TimestampBadge, clearHighlightCache, createPersistentLogBuffer, createTableParser, getSynthwaveGhosttyTheme, getTerminalTheme, hexToResttyColor, logLineBadgesStyles, terminalActionBarStyles, terminalChromeStyles, terminalChromeVariants, terminalConnectionStatusStyles, terminalFontControlsStyles, terminalLogBadgeStyles, terminalPanelFooterStyles, terminalPanelHeaderStyles, terminalScrollStyles, terminalSplitButtonStyles, terminalStatusBarStyles, useTerminal, useTerminalConnection, useTerminalDimensions, useTerminalFontSize, useTerminalKeyboardShortcuts, useTerminalPaneManager, useTerminalSettings, useTerminalWebSocket, xtermThemeToGhostty };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Terminal · interactive router sub-entry.
|
|
3
|
+
*
|
|
4
|
+
* Exports `TerminalInteractivePanel`, the thin router that lazy-loads the
|
|
5
|
+
* xterm/restty/wterm implementations based on settings. The router file
|
|
6
|
+
* itself uses `lazy()` so importing this entry does NOT eagerly pull
|
|
7
|
+
* peer deps — they only resolve once the matching renderer is selected
|
|
8
|
+
* at runtime.
|
|
9
|
+
*
|
|
10
|
+
* Still, every renderer's peer deps must be installed where it might
|
|
11
|
+
* be used. Prefer importing each renderer's sub-entry directly when
|
|
12
|
+
* you only need one.
|
|
13
|
+
*
|
|
14
|
+
* @module @mks2508/mks-ui/react/blocks/Terminal/interactive
|
|
15
|
+
*/
|
|
16
|
+
export { TerminalInteractivePanel } from './panel/TerminalInteractivePanel';
|
|
17
|
+
export type { ITerminalInteractivePanelProps, ITerminalInteractivePanelRef, } from './panel/TerminalInteractivePanel.types';
|
|
18
|
+
//# sourceMappingURL=interactive.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interactive.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/interactive.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AAC5E,YAAY,EACV,8BAA8B,EAC9B,4BAA4B,GAC7B,MAAM,wCAAwC,CAAC"}
|
|
@@ -6,9 +6,9 @@ import { TerminalDisconnectedOverlay } from "../controls/TerminalAtoms.js";
|
|
|
6
6
|
import { TerminalActionBar } from "../controls/TerminalActionBar/index.js";
|
|
7
7
|
import { TerminalStatusBar } from "../controls/TerminalStatusBar/index.js";
|
|
8
8
|
import { TerminalPanelChrome } from "./TerminalPanelChrome.js";
|
|
9
|
-
import { ResttyTerminal } from "../restty/ResttyTerminal.js";
|
|
10
|
-
import "../restty/index.js";
|
|
11
9
|
import { TerminalDebugPanel } from "./TerminalDebugPanel/index.js";
|
|
10
|
+
import { ResttyTerminal } from "../restty/ResttyTerminal.js";
|
|
11
|
+
import "../restty.js";
|
|
12
12
|
import { forwardRef, useImperativeHandle } from "react";
|
|
13
13
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
14
|
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
import { getTerminalTheme } from "../Terminal.theme.js";
|
|
4
3
|
import { useTerminalWebSocket } from "../hooks/useTerminalWebSocket.js";
|
|
5
4
|
import { useTerminalSettings } from "../hooks/useTerminalSettings.js";
|
|
6
5
|
import { TerminalClearButton, TerminalDimensionsBadge, TerminalDisconnectedOverlay, TerminalReconnectButton } from "../controls/TerminalAtoms.js";
|
|
@@ -10,6 +9,7 @@ import { TerminalActionBar } from "../controls/TerminalActionBar/index.js";
|
|
|
10
9
|
import { TerminalConnectionStatus } from "../controls/TerminalConnectionStatus/index.js";
|
|
11
10
|
import { TerminalStatusBar } from "../controls/TerminalStatusBar/index.js";
|
|
12
11
|
import { TerminalPanelChrome } from "./TerminalPanelChrome.js";
|
|
12
|
+
import { getTerminalTheme } from "../Terminal.theme.js";
|
|
13
13
|
import { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from "react";
|
|
14
14
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
15
15
|
import { Terminal } from "@xterm/xterm";
|
|
@@ -10,13 +10,13 @@ import { SearchIcon } from "../../../../icons/lucide-animated/search.js";
|
|
|
10
10
|
import { TerminalIcon } from "../../../../icons/lucide-animated/terminal.js";
|
|
11
11
|
import "../../../../icons/lucide-animated/index.js";
|
|
12
12
|
import { IconWrapper } from "../../../../lib/icon-wrapper.js";
|
|
13
|
-
import { getTerminalTheme } from "../../Terminal.theme.js";
|
|
14
13
|
import { LogParserService } from "../../parsing/LogParserService.js";
|
|
15
14
|
import { ACTION_BUTTON_STYLES, PRIMARY_GLOW, TOGGLE_STYLES } from "../../Terminal.tokens.js";
|
|
16
15
|
import { useTerminalSettings } from "../../hooks/useTerminalSettings.js";
|
|
17
16
|
import { TerminalPanelChrome } from "../TerminalPanelChrome.js";
|
|
18
|
-
import { TerminalFilterDropdown } from "../TerminalFilterDropdown/index.js";
|
|
19
17
|
import { TerminalPanelFooter } from "../TerminalPanelFooter/index.js";
|
|
18
|
+
import { getTerminalTheme } from "../../Terminal.theme.js";
|
|
19
|
+
import { TerminalFilterDropdown } from "../TerminalFilterDropdown/index.js";
|
|
20
20
|
import { LogLinesViewer } from "../LogLinesViewer.js";
|
|
21
21
|
import { terminalLogsPanelStyles } from "./TerminalLogsPanel.styles.js";
|
|
22
22
|
import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from "react";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
+
import { getSynthwaveGhosttyTheme, xtermThemeToGhostty } from "../Terminal.theme.restty.js";
|
|
3
4
|
import { ResttyProvider } from "./ResttyContext.js";
|
|
4
5
|
import { useResttySession } from "./ResttySessionProvider.js";
|
|
5
|
-
import { getSynthwaveGhosttyTheme, xtermThemeToGhostty } from "../Terminal.theme.restty.js";
|
|
6
6
|
import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
|
|
7
7
|
import { jsx } from "react/jsx-runtime";
|
|
8
8
|
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Terminal · restty sub-entry.
|
|
3
|
+
*
|
|
4
|
+
* Opt-in module that pulls `@mks2508/restty`. Consumers that don't render
|
|
5
|
+
* a restty (GPU/WASM) terminal should NOT import this file — the main
|
|
6
|
+
* `@mks2508/mks-ui/react` barrel does not re-export anything from here.
|
|
7
|
+
*
|
|
8
|
+
* For the readonly `TerminalDisplay` use the lighter
|
|
9
|
+
* `@mks2508/mks-ui/react/blocks/Terminal/display` entry instead.
|
|
10
|
+
*
|
|
11
|
+
* @module @mks2508/mks-ui/react/blocks/Terminal/restty
|
|
12
|
+
*
|
|
13
|
+
* @example
|
|
14
|
+
* ```tsx
|
|
15
|
+
* import {
|
|
16
|
+
* TerminalInteractivePanelRestty,
|
|
17
|
+
* ResttyTerminal,
|
|
18
|
+
* ResttyProvider,
|
|
19
|
+
* useRestty,
|
|
20
|
+
* } from '@mks2508/mks-ui/react/blocks/Terminal/restty';
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
export { TerminalInteractivePanelRestty } from './panel/TerminalInteractivePanelRestty';
|
|
24
|
+
export { TerminalThemeSelector, type ITerminalThemeSelectorProps } from './panel/TerminalThemeSelector';
|
|
25
|
+
export { ResttyTerminal, ResttySessionProvider, useResttySession, ResttyProvider, useRestty, useResttyPane, useResttyPanes, useResttyVisibility, useResttyPlugins, } from './restty/index';
|
|
26
|
+
export type { IResttyTerminalProps, IResttyTerminalRef, IResttySessionProviderProps, IResttySessionContextValue, IResttyContextValue, IUseResttyPaneReturn, IUseResttyPanesReturn, IUseResttyVisibilityOptions, IUseResttyPluginsReturn, Restty, ResttyPlugin, ResttyPluginInfo, ResttyPaneHandle, ResttyFontSource, ResttyPaneSplitDirection, GhosttyTheme, } from './restty/index';
|
|
27
|
+
//# sourceMappingURL=restty.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"restty.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/restty.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAGH,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAC;AAGxF,OAAO,EAAE,qBAAqB,EAAE,KAAK,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;AAGxG,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,gBAAgB,CAAC;AAExB,YAAY,EACV,oBAAoB,EACpB,kBAAkB,EAClB,2BAA2B,EAC3B,0BAA0B,EAC1B,mBAAmB,EACnB,oBAAoB,EACpB,qBAAqB,EACrB,2BAA2B,EAC3B,uBAAuB,EACvB,MAAM,EACN,YAAY,EACZ,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,wBAAwB,EACxB,YAAY,GACb,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { TerminalThemeSelector } from "./panel/TerminalThemeSelector/index.js";
|
|
2
|
+
import { TerminalInteractivePanelRestty } from "./panel/TerminalInteractivePanelRestty.js";
|
|
3
|
+
import { ResttyProvider, useRestty } from "./restty/ResttyContext.js";
|
|
4
|
+
import { ResttySessionProvider, useResttySession } from "./restty/ResttySessionProvider.js";
|
|
5
|
+
import { ResttyTerminal } from "./restty/ResttyTerminal.js";
|
|
6
|
+
import { useResttyPane } from "./restty/useResttyPane.js";
|
|
7
|
+
import { useResttyPanes } from "./restty/useResttyPanes.js";
|
|
8
|
+
import { useResttyVisibility } from "./restty/useResttyVisibility.js";
|
|
9
|
+
import { useResttyPlugins } from "./restty/useResttyPlugins.js";
|
|
10
|
+
import "./restty/index.js";
|
|
11
|
+
|
|
12
|
+
export { ResttyProvider, ResttySessionProvider, ResttyTerminal, TerminalInteractivePanelRestty, TerminalThemeSelector, useRestty, useResttyPane, useResttyPanes, useResttyPlugins, useResttySession, useResttyVisibility };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Terminal · wterm sub-entry.
|
|
3
|
+
*
|
|
4
|
+
* Opt-in module that pulls `@wterm/react` and `@wterm/core` peer deps.
|
|
5
|
+
* Consumers that don't use wterm should NOT import this file — the main
|
|
6
|
+
* `@mks2508/mks-ui/react` barrel does not re-export anything from here.
|
|
7
|
+
*
|
|
8
|
+
* @module @mks2508/mks-ui/react/blocks/Terminal/wterm
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* import {
|
|
13
|
+
* TerminalInteractivePanelWterm,
|
|
14
|
+
* WtermJsonTransport,
|
|
15
|
+
* } from '@mks2508/mks-ui/react/blocks/Terminal/wterm';
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export { TerminalInteractivePanelWterm } from './panel/TerminalInteractivePanelWterm';
|
|
19
|
+
export { WtermJsonTransport } from './wterm/WtermJsonTransport';
|
|
20
|
+
//# sourceMappingURL=wterm.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"wterm.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/wterm.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,6BAA6B,EAAE,MAAM,uCAAuC,CAAC;AACtF,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Terminal · xterm sub-entry.
|
|
3
|
+
*
|
|
4
|
+
* Opt-in module that pulls `@xterm/xterm` and the addon family
|
|
5
|
+
* (`@xterm/addon-fit`, `addon-web-links`, `addon-search`, `addon-unicode11`).
|
|
6
|
+
* Consumers that don't render xterm should NOT import this file — the main
|
|
7
|
+
* `@mks2508/mks-ui/react` barrel does not re-export anything from here.
|
|
8
|
+
*
|
|
9
|
+
* @module @mks2508/mks-ui/react/blocks/Terminal/xterm
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* import {
|
|
14
|
+
* TerminalLogsPanel,
|
|
15
|
+
* XTermWrapper,
|
|
16
|
+
* } from '@mks2508/mks-ui/react/blocks/Terminal/xterm';
|
|
17
|
+
* ```
|
|
18
|
+
*/
|
|
19
|
+
export { TerminalPanel, type ITerminalPanelProps } from './TerminalPanel';
|
|
20
|
+
export { TerminalLogsPanel, terminalLogsPanelStyles, type TerminalLogsPanelSlot, } from './panel/TerminalLogsPanel';
|
|
21
|
+
export { TerminalInteractivePanelXterm } from './panel/TerminalInteractivePanelXterm';
|
|
22
|
+
export { XTermAdapter } from './XTermAdapter';
|
|
23
|
+
export { XTermWrapper, useTerminalSearch, type IXTermWrapperProps, } from './TerminalXterm';
|
|
24
|
+
export { LogLinesViewer, type ILogLinesViewerProps } from './panel/LogLinesViewer';
|
|
25
|
+
export type { ITerminalLogsPanelProps, ITerminalLogsPanelRef, } from './panel/TerminalLogsPanel.types';
|
|
26
|
+
//# sourceMappingURL=xterm.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"xterm.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/blocks/Terminal/xterm.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAGH,OAAO,EAAE,aAAa,EAAE,KAAK,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAG1E,OAAO,EACL,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,qBAAqB,GAC3B,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAE,6BAA6B,EAAE,MAAM,uCAAuC,CAAC;AAGtF,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,KAAK,kBAAkB,GACxB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAAE,cAAc,EAAE,KAAK,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAGnF,YAAY,EACV,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,iCAAiC,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { XTermWrapper, useTerminalSearch } from "./TerminalXterm.js";
|
|
2
|
+
import { TerminalPanel } from "./TerminalPanel.js";
|
|
3
|
+
import { LogLinesViewer } from "./panel/LogLinesViewer.js";
|
|
4
|
+
import { terminalLogsPanelStyles } from "./panel/TerminalLogsPanel/TerminalLogsPanel.styles.js";
|
|
5
|
+
import { TerminalLogsPanel } from "./panel/TerminalLogsPanel/index.js";
|
|
6
|
+
import { TerminalInteractivePanelXterm } from "./panel/TerminalInteractivePanelXterm.js";
|
|
7
|
+
import { XTermAdapter } from "./XTermAdapter.js";
|
|
8
|
+
|
|
9
|
+
export { LogLinesViewer, TerminalInteractivePanelXterm, TerminalLogsPanel, TerminalPanel, XTermAdapter, XTermWrapper, terminalLogsPanelStyles, useTerminalSearch };
|
package/dist/react-ui/index.d.ts
CHANGED
|
@@ -18,6 +18,6 @@ export * from './icons';
|
|
|
18
18
|
export * from './lib';
|
|
19
19
|
export { Sidebar, SidebarNav, SidebarToggle, SidebarContent, SidebarIndicator, SidebarFluidIndicator, SidebarSafeArea, SidebarItem, SidebarSubContent, SidebarSubLink, SidebarTooltip, useSidebarContext, useSidebarKeyboard, useSidebarIndicator, useSubContent, generateSidebarStyles, generateIndicatorStyles, type SidebarProps, type SidebarNavProps, type SidebarToggleProps, type SidebarContentProps, type SidebarIndicatorProps, type SidebarSafeAreaProps, type SidebarItemProps, type SidebarState, type SidebarToggleState, type SidebarItemState, type SidebarIndicatorState, type SidebarContextValue, type SidebarDimensions, type SidebarSafeAreas, type SidebarAnimations, type SidebarConfig, type SidebarRenderProp, type SidebarToggleRenderProp, type SidebarItemRenderProp, type SidebarIndicatorRenderProp, type SidebarVisualStyle, type SidebarSubContentProps, type SidebarSubLinkProps, type SidebarTooltipProps, SidebarCollapseMode, SidebarHideBehaviour, SidebarHideOpensBehavior, SidebarLayoutBehaviour, SidebarWidth, SidebarTransitionDuration, SidebarZIndex, SidebarBorderRadius, SidebarSafeAreaPosition, SidebarTimingFunction, SidebarIconLibrary, DEFAULT_DIMENSIONS, DEFAULT_SAFE_AREAS, DEFAULT_ANIMATIONS, DEFAULT_CONFIG, DEFAULT_VISUAL_STYLE, SIDEBAR_VISUAL_PRESETS, } from './blocks/Sidebar';
|
|
20
20
|
export { MobileBottomNav, NavVariant, NavSize, LabelPosition, AnimationType, NavItemState, IconSize, ZIndexLevel, BlurIntensity, useIOSSafariFix, useIOSFixedReset, detectIOSVersion, type RootProps, type NavListProps, type NavItemProps, type NavContextValue, type SpringConfig, type TweenConfig, type AnimationConfig, type GlassConfig, type BaseNavProps, type IOSSafariFixConfig, DEFAULT_ANIMATION_CONFIG, DEFAULT_GLASS_CONFIG, DEFAULT_SPRING_CONFIG, DEFAULT_TWEEN_CONFIG, rootVariants, navListVariants, navItemVariants, iconVariants, labelVariants, navBadgeVariants, spacerVariants, } from './blocks/BottomNavBar';
|
|
21
|
-
export {
|
|
22
|
-
export type {
|
|
21
|
+
export { TerminalPanelChrome, TerminalPanelHeader, TerminalPanelFooter, TerminalSettingsPopover, LogParserService, TerminalActionBar, TerminalStatusBar, TerminalConnectionStatus, TerminalClearButton, LOG_LEVEL_STYLES, STATUS_COLORS, } from './blocks/Terminal';
|
|
22
|
+
export type { ITerminalPanelHeaderProps, ITerminalPanelFooterProps, IParsedLogEntry, TLogLevel, TLogLevelFilter, ITerminalSession, ILevelFilterButton, TTerminalAction, } from './blocks/Terminal';
|
|
23
23
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react-ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,cAAc,cAAc,CAAC;AAG7B,cAAc,MAAM,CAAC;AAGrB,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,cAAc,OAAO,CAAC;AAItB,OAAO,EACL,OAAO,EACP,UAAU,EACV,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,qBAAqB,EACrB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,cAAc,EACd,iBAAiB,EACjB,kBAAkB,EAClB,mBAAmB,EACnB,aAAa,EACb,qBAAqB,EACrB,uBAAuB,EACvB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,mBAAmB,EACnB,oBAAoB,EACpB,wBAAwB,EACxB,sBAAsB,EACtB,YAAY,EACZ,yBAAyB,EACzB,aAAa,EACb,mBAAmB,EACnB,uBAAuB,EACvB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,kBAAkB,CAAC;AAG1B,OAAO,EACL,eAAe,EACf,UAAU,EACV,OAAO,EACP,aAAa,EACb,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,kBAAkB,EACvB,wBAAwB,EACxB,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,eAAe,EACf,eAAe,EACf,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,cAAc,GACf,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react-ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,cAAc,cAAc,CAAC;AAG7B,cAAc,MAAM,CAAC;AAGrB,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,cAAc,OAAO,CAAC;AAItB,OAAO,EACL,OAAO,EACP,UAAU,EACV,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,qBAAqB,EACrB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,cAAc,EACd,iBAAiB,EACjB,kBAAkB,EAClB,mBAAmB,EACnB,aAAa,EACb,qBAAqB,EACrB,uBAAuB,EACvB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,mBAAmB,EACnB,oBAAoB,EACpB,wBAAwB,EACxB,sBAAsB,EACtB,YAAY,EACZ,yBAAyB,EACzB,aAAa,EACb,mBAAmB,EACnB,uBAAuB,EACvB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,kBAAkB,CAAC;AAG1B,OAAO,EACL,eAAe,EACf,UAAU,EACV,OAAO,EACP,aAAa,EACb,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,kBAAkB,EACvB,wBAAwB,EACxB,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,eAAe,EACf,eAAe,EACf,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,cAAc,GACf,MAAM,uBAAuB,CAAC;AAc/B,OAAO,EAEL,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EAEnB,uBAAuB,EAEvB,gBAAgB,EAEhB,iBAAiB,EACjB,iBAAiB,EACjB,wBAAwB,EACxB,mBAAmB,EAEnB,gBAAgB,EAChB,aAAa,GACd,MAAM,mBAAmB,CAAC;AAE3B,YAAY,EAEV,yBAAyB,EACzB,yBAAyB,EAEzB,eAAe,EACf,SAAS,EACT,eAAe,EAEf,gBAAgB,EAChB,kBAAkB,EAClB,eAAe,GAChB,MAAM,mBAAmB,CAAC"}
|
package/dist/react-ui/index.js
CHANGED
|
@@ -75,7 +75,9 @@ import { fieldVariants } from "./ui/Field/Field.styles.js";
|
|
|
75
75
|
import { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle } from "./ui/Field/index.js";
|
|
76
76
|
import { FileIconStyles, FolderIconStyles, fileIconVariants, folderIconVariants } from "./ui/FileIcon/FileIcon.styles.js";
|
|
77
77
|
import { FileIcon, FolderIcon } from "./ui/FileIcon/index.js";
|
|
78
|
-
import {
|
|
78
|
+
import { MiddleTruncateStyles, middleTruncateVariants } from "./ui/MiddleTruncate/MiddleTruncate.styles.js";
|
|
79
|
+
import { MiddleTruncate } from "./ui/MiddleTruncate/index.js";
|
|
80
|
+
import { MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles } from "./ui/MiddleTruncatePath/MiddleTruncatePath.styles.js";
|
|
79
81
|
import { MiddleTruncatePath } from "./ui/MiddleTruncatePath/index.js";
|
|
80
82
|
import { FileItemGitStatusClasses, FileItemStyles, fileItemVariants } from "./ui/FileItem/FileItem.styles.js";
|
|
81
83
|
import { FileItem } from "./ui/FileItem/index.js";
|
|
@@ -164,17 +166,13 @@ import "./blocks/BottomNavBar/index.js";
|
|
|
164
166
|
import { LogParserService } from "./blocks/Terminal/parsing/LogParserService.js";
|
|
165
167
|
import { LOG_LEVEL_STYLES, STATUS_COLORS } from "./blocks/Terminal/Terminal.tokens.js";
|
|
166
168
|
import { TerminalClearButton } from "./blocks/Terminal/controls/TerminalAtoms.js";
|
|
169
|
+
import { TerminalSettingsPopover } from "./blocks/Terminal/panel/TerminalSettingsPopover/index.js";
|
|
167
170
|
import { TerminalActionBar } from "./blocks/Terminal/controls/TerminalActionBar/index.js";
|
|
168
171
|
import { TerminalConnectionStatus } from "./blocks/Terminal/controls/TerminalConnectionStatus/index.js";
|
|
169
172
|
import { TerminalStatusBar } from "./blocks/Terminal/controls/TerminalStatusBar/index.js";
|
|
170
173
|
import { TerminalPanelHeader } from "./blocks/Terminal/panel/TerminalPanelHeader/index.js";
|
|
171
174
|
import { TerminalPanelChrome } from "./blocks/Terminal/panel/TerminalPanelChrome.js";
|
|
172
175
|
import { TerminalPanelFooter } from "./blocks/Terminal/panel/TerminalPanelFooter/index.js";
|
|
173
|
-
import { LogLinesViewer } from "./blocks/Terminal/panel/LogLinesViewer.js";
|
|
174
|
-
import { terminalLogsPanelStyles } from "./blocks/Terminal/panel/TerminalLogsPanel/TerminalLogsPanel.styles.js";
|
|
175
|
-
import { TerminalLogsPanel } from "./blocks/Terminal/panel/TerminalLogsPanel/index.js";
|
|
176
|
-
import { terminalDisplayStyles, terminalDisplayVariants } from "./blocks/Terminal/TerminalDisplay.styles.js";
|
|
177
|
-
import { TerminalDisplay } from "./blocks/Terminal/TerminalDisplay.js";
|
|
178
176
|
import "./blocks/Terminal/index.js";
|
|
179
177
|
|
|
180
|
-
export { ANIMATION_CONFIGS, ANIMATION_DEFAULTS, Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionStyles, AccordionTrigger, ActivityIcon, AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogPortal, AlertDialogStyles, AlertDialogTitle, AlertDialogTrigger, AnimationType, ArrowDownToLineIcon, ArrowUpIcon, AutoHeight, Badge, BellElectricIcon, BellIcon, BlurIntensity, BotIcon, BoxIcon, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Check, Checkbox, CheckboxIndicator, CircleCheckIcon, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, CornerBracket, CountingNumber, DEFAULT_ANIMATIONS, DEFAULT_ANIMATION_CONFIG, DEFAULT_CONFIG, DEFAULT_DIMENSIONS, DEFAULT_GLASS_CONFIG, DEFAULT_GOOEY_CONFIG, DEFAULT_SAFE_AREAS, DEFAULT_SPRING_CONFIG, DEFAULT_TWEEN_CONFIG, DEFAULT_VISUAL_STYLE, DOT_MATRIX_PATTERNS, DataCard, DataCardActions, DataCardBracket, DataCardLabel, DataCardToggle, DataCardValue, DeleteIcon, Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DotMatrix, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicToggle, DynamicToggleGroup, DynamicToggleOption, EASINGS, EFFECTS, Edit2, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, FileIcon, FileIconStyles, FileItem, FileItemGitStatusClasses, FileItemStyles, FilePanel, FilePanelStyles, FileTree, FileTreeStyles, FolderIcon, FolderIconStyles, GOOEY_DEFAULTS, Globe, GooeyButton, GooeyCanvas, GooeyFilter, GooeyMorphingSurface, Highlight, HighlightItem, HomeIcon, HugeIcons, IconSize, IconWrapper, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, LOG_LEVEL_STYLES, Label, LabelPosition, Layers, LayoutPanelTopIcon, ListIcon,
|
|
178
|
+
export { ANIMATION_CONFIGS, ANIMATION_DEFAULTS, Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionStyles, AccordionTrigger, ActivityIcon, AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogPortal, AlertDialogStyles, AlertDialogTitle, AlertDialogTrigger, AnimationType, ArrowDownToLineIcon, ArrowUpIcon, AutoHeight, Badge, BellElectricIcon, BellIcon, BlurIntensity, BotIcon, BoxIcon, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Check, Checkbox, CheckboxIndicator, CircleCheckIcon, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, CornerBracket, CountingNumber, DEFAULT_ANIMATIONS, DEFAULT_ANIMATION_CONFIG, DEFAULT_CONFIG, DEFAULT_DIMENSIONS, DEFAULT_GLASS_CONFIG, DEFAULT_GOOEY_CONFIG, DEFAULT_SAFE_AREAS, DEFAULT_SPRING_CONFIG, DEFAULT_TWEEN_CONFIG, DEFAULT_VISUAL_STYLE, DOT_MATRIX_PATTERNS, DataCard, DataCardActions, DataCardBracket, DataCardLabel, DataCardToggle, DataCardValue, DeleteIcon, Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DotMatrix, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicToggle, DynamicToggleGroup, DynamicToggleOption, EASINGS, EFFECTS, Edit2, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, FileIcon, FileIconStyles, FileItem, FileItemGitStatusClasses, FileItemStyles, FilePanel, FilePanelStyles, FileTree, FileTreeStyles, FolderIcon, FolderIconStyles, GOOEY_DEFAULTS, Globe, GooeyButton, GooeyCanvas, GooeyFilter, GooeyMorphingSurface, Highlight, HighlightItem, HomeIcon, HugeIcons, IconSize, IconWrapper, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, LOG_LEVEL_STYLES, Label, LabelPosition, Layers, LayoutPanelTopIcon, ListIcon, LogParserService, Menu, MenuArrow, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuGroup, MenuGroupLabel, MenuHighlight, MenuHighlightItem, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, MiddleTruncate, MiddleTruncatePath, MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles, MiddleTruncateStyles, MobileBottomNav, Morph, MorphPath, MorphingPopover, MorphingPopoverWithTarget, NavItemState, NavSize, NavVariant, OperationCard, OperationCardActions, OperationCardHeader, OperationCardProgress, OperationCardRoot, OperationCardStats, OperationCardStyles, OperationCardVisualizer, PRESETS, Package, Palette, PlusIcon, Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, RESPONSIVE_CONFIGS, RefreshCw, ReorderRoot as Reorder, Rocket, SIDEBAR_VISUAL_PRESETS, STATUS_COLORS, Save, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SettingsIcon, Sidebar, SidebarBorderRadius, SidebarCollapseMode, SidebarContent, SidebarFluidIndicator, SidebarHideBehaviour, SidebarHideOpensBehavior, SidebarIconLibrary, SidebarIndicator, SidebarItem, SidebarLayoutBehaviour, SidebarNav, SidebarSafeArea, SidebarSafeAreaPosition, SidebarSubContent, SidebarSubLink, SidebarTimingFunction, SidebarToggle, SidebarTooltip, SidebarTransitionDuration, SidebarWidth, SidebarZIndex, SlidingNumber, SlidingText, Slot, Switch, SwitchIcon, SwitchThumb, TIMING, TRANSFORMS, Tabs, TabsHighlight, TabsHighlightItem, TabsList, TabsPanel, TabsPanels, TabsTab, TerminalActionBar, TerminalClearButton, TerminalConnectionStatus, TerminalIcon, TerminalPanelChrome, TerminalPanelFooter, TerminalPanelHeader, TerminalSettingsPopover, TerminalStatusBar, TextFlow, Textarea, Tooltip, TooltipArrow, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipProvider, TooltipTrigger, Trash2, TrendingDownIcon, TrendingUpIcon, Type, Upload, XIcon, ZIndexLevel, accordionVariants, badgeVariants, bracketVariants, buildColorMatrixValues, buildDelays, buildFilterString, buttonStateStyles, buttonVariants, calculateSeparatorCoordination, cardVariants, checkboxStyles, cn, computeBlur, dataCardStyles, dataCardVariants, detectIOSVersion, dialogStyles, dynamicToggleStyles, dynamicToggleVariants, fieldVariants, fileIconVariants, fileItemVariants, filePanelVariants, fileTreeVariants, folderIconVariants, generateIndicatorStyles, generateSidebarStyles, getResponsiveDuration, getResponsiveStagger, getStrictContext, iconVariants, inputGroupAddonVariants, inputGroupButtonVariants, labelVariants, middleTruncateVariants, morphPathDown, morphPathUp, badgeVariants$1 as navBadgeVariants, navItemVariants, navListVariants, operationCardVariants, popoverStyles, progressStyles, rootVariants, shouldShowSeparator, spacerVariants, switchStyles, tabsIndicatorVariants, tabsListVariants, tabsTabVariants, tooltipStyles, useAccordionItem, useAlertDialog, useAnimationOrchestrator, useAutoHeight, useCSSGridMorph, useCheckbox, useComboboxAnchor, useControlledState, useDataCard, useDataState, useDialog, useDynamicToggle, useElementRegistry, useFLIPAnimation, useFLIPClipPath, useHighlight, useIOSFixedReset, useIOSSafariFix, useIsInView, useListFormat, useMenu, useMenuActiveValue, useMorph, useMorphContext, useMorphPath, useOperationCard, usePopover, usePositionCapture, useProgress, useReorder, useReorderPresence, useSidebarContext, useSidebarIndicator, useSidebarKeyboard, useSubContent, useSwitch, useTooltip, useViewTransitions };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Styles for MiddleTruncate.
|
|
3
|
+
*
|
|
4
|
+
* @module @mks2508/mks-ui/react/ui/MiddleTruncate
|
|
5
|
+
*/
|
|
6
|
+
import type { StyleSlots } from '../../../core/types';
|
|
7
|
+
/**
|
|
8
|
+
* Visual regions of the MiddleTruncate component.
|
|
9
|
+
*
|
|
10
|
+
* | Slot | Region |
|
|
11
|
+
* |------|--------|
|
|
12
|
+
* | `root` | Container `<span>` wrapping start + ellipsis + end segments |
|
|
13
|
+
* | `start` | Truncatable leading portion (collapses when narrow) |
|
|
14
|
+
* | `ellipsis` | Ellipsis character(s) between start and end |
|
|
15
|
+
* | `end` | Fixed trailing portion (always visible) |
|
|
16
|
+
*/
|
|
17
|
+
export type TMiddleTruncateSlot = 'root' | 'start' | 'ellipsis' | 'end';
|
|
18
|
+
/**
|
|
19
|
+
* Default Tailwind classes for each MiddleTruncate slot.
|
|
20
|
+
*
|
|
21
|
+
* Uses CSS-only flex truncation — `start` segment has `min-w-0 flex-1 truncate`
|
|
22
|
+
* so the browser truncates it automatically when the container is too narrow.
|
|
23
|
+
* No JS measurement, no ResizeObserver.
|
|
24
|
+
*/
|
|
25
|
+
export declare const MiddleTruncateStyles: StyleSlots<TMiddleTruncateSlot>;
|
|
26
|
+
/** CVA variants for the MiddleTruncate root. */
|
|
27
|
+
export declare const middleTruncateVariants: (props?: ({} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
28
|
+
/** Tailwind classes used when text is short enough to skip splitting. */
|
|
29
|
+
export declare const MiddleTruncateShortRootStyles: "truncate";
|
|
30
|
+
//# sourceMappingURL=MiddleTruncate.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MiddleTruncate.styles.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/MiddleTruncate/MiddleTruncate.styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C;;;;;;;;;GASG;AACH,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,KAAK,CAAC;AAExE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,EAAE,UAAU,CAAC,mBAAmB,CAKvD,CAAC;AAEX,gDAAgD;AAChD,eAAO,MAAM,sBAAsB,2FAGjC,CAAC;AAEH,yEAAyE;AACzE,eAAO,MAAM,6BAA6B,EAAG,UAAmB,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { cva } from "class-variance-authority";
|
|
2
|
+
|
|
3
|
+
//#region src/react-ui/ui/MiddleTruncate/MiddleTruncate.styles.ts
|
|
4
|
+
/**
|
|
5
|
+
* Styles for MiddleTruncate.
|
|
6
|
+
*
|
|
7
|
+
* @module @mks2508/mks-ui/react/ui/MiddleTruncate
|
|
8
|
+
*/
|
|
9
|
+
/**
|
|
10
|
+
* Default Tailwind classes for each MiddleTruncate slot.
|
|
11
|
+
*
|
|
12
|
+
* Uses CSS-only flex truncation — `start` segment has `min-w-0 flex-1 truncate`
|
|
13
|
+
* so the browser truncates it automatically when the container is too narrow.
|
|
14
|
+
* No JS measurement, no ResizeObserver.
|
|
15
|
+
*/
|
|
16
|
+
const MiddleTruncateStyles = {
|
|
17
|
+
root: "inline-flex items-baseline min-w-0 max-w-full",
|
|
18
|
+
start: "truncate min-w-0 flex-1",
|
|
19
|
+
ellipsis: "shrink-0",
|
|
20
|
+
end: "shrink-0"
|
|
21
|
+
};
|
|
22
|
+
/** CVA variants for the MiddleTruncate root. */
|
|
23
|
+
const middleTruncateVariants = cva(MiddleTruncateStyles.root, {
|
|
24
|
+
variants: {},
|
|
25
|
+
defaultVariants: {}
|
|
26
|
+
});
|
|
27
|
+
/** Tailwind classes used when text is short enough to skip splitting. */
|
|
28
|
+
const MiddleTruncateShortRootStyles = "truncate";
|
|
29
|
+
|
|
30
|
+
//#endregion
|
|
31
|
+
export { MiddleTruncateShortRootStyles, MiddleTruncateStyles, middleTruncateVariants };
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Types for MiddleTruncate.
|
|
3
|
+
*
|
|
4
|
+
* @module @mks2508/mks-ui/react/ui/MiddleTruncate
|
|
5
|
+
*/
|
|
6
|
+
import type { SlotOverrides } from '../../../core/types';
|
|
7
|
+
import type { TMiddleTruncateSlot } from './MiddleTruncate.styles';
|
|
8
|
+
/**
|
|
9
|
+
* Props for `<MiddleTruncate>`.
|
|
10
|
+
*
|
|
11
|
+
* Supports two strategies via discriminated union:
|
|
12
|
+
* - `strategy: 'chars'` — split by individual characters (hashes, UUIDs, commit SHAs)
|
|
13
|
+
* - `strategy: 'segments'` — split by a separator string (paths, domains, k8s names)
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```tsx
|
|
17
|
+
* // Char-based truncation (keep 6 start + 4 end chars)
|
|
18
|
+
* <MiddleTruncate strategy="chars" text="0xABCDEF1234567890" keepStart={6} keepEnd={4} />
|
|
19
|
+
* // → 0xABCD…7890
|
|
20
|
+
* ```
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* // Segment-based truncation (file path)
|
|
25
|
+
* <MiddleTruncate strategy="segments" separator="/" text="src/components/Button/index.tsx" keepEnd={2} />
|
|
26
|
+
* // → src/…/Button/index.tsx
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export type IMiddleTruncateProps = {
|
|
30
|
+
/** Full text to truncate. */
|
|
31
|
+
text: string;
|
|
32
|
+
/** Character-level truncation. */
|
|
33
|
+
strategy: 'chars';
|
|
34
|
+
/** Leading characters locked visible. Default 0. */
|
|
35
|
+
keepStart?: number;
|
|
36
|
+
/** Trailing characters locked visible. Default 6. */
|
|
37
|
+
keepEnd?: number;
|
|
38
|
+
/** Ellipsis character. Default '…'. */
|
|
39
|
+
ellipsis?: string;
|
|
40
|
+
/** Tooltip on hover. Default: full text. */
|
|
41
|
+
title?: string;
|
|
42
|
+
/** Optional CSS class merged onto the root span. */
|
|
43
|
+
className?: string;
|
|
44
|
+
/** Override default Tailwind classes per visual slot. */
|
|
45
|
+
slots?: SlotOverrides<TMiddleTruncateSlot>;
|
|
46
|
+
} | {
|
|
47
|
+
/** Full text to truncate. */
|
|
48
|
+
text: string;
|
|
49
|
+
/** Segment-level truncation split by separator. */
|
|
50
|
+
strategy: 'segments';
|
|
51
|
+
/** Required separator string (e.g. '/' for paths, '.' for domains, '-' for k8s). */
|
|
52
|
+
separator: string;
|
|
53
|
+
/** Leading segments locked visible. Default 0. */
|
|
54
|
+
keepStart?: number;
|
|
55
|
+
/** Trailing segments locked visible. Default 1. */
|
|
56
|
+
keepEnd?: number;
|
|
57
|
+
/** Ellipsis character. Default '…'. */
|
|
58
|
+
ellipsis?: string;
|
|
59
|
+
/** Tooltip on hover. Default: full text. */
|
|
60
|
+
title?: string;
|
|
61
|
+
/** Optional CSS class merged onto the root span. */
|
|
62
|
+
className?: string;
|
|
63
|
+
/** Override default Tailwind classes per visual slot. */
|
|
64
|
+
slots?: SlotOverrides<TMiddleTruncateSlot>;
|
|
65
|
+
};
|
|
66
|
+
//# sourceMappingURL=MiddleTruncate.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MiddleTruncate.types.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/MiddleTruncate/MiddleTruncate.types.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAEnE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,oBAAoB,GAC5B;IACE,6BAA6B;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,QAAQ,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,KAAK,CAAC,EAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC;CAC5C,GACD;IACE,6BAA6B;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,QAAQ,EAAE,UAAU,CAAC;IACrB,oFAAoF;IACpF,SAAS,EAAE,MAAM,CAAC;IAClB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,KAAK,CAAC,EAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC;CAC5C,CAAC"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* MiddleTruncate — CSS-only middle truncation primitive.
|
|
3
|
+
*
|
|
4
|
+
* Truncates text from the middle, preserving the start and/or end portions.
|
|
5
|
+
* Supports two strategies:
|
|
6
|
+
*
|
|
7
|
+
* - `strategy='chars'` — splits by individual characters, useful for hashes,
|
|
8
|
+
* UUIDs, commit SHAs, or any long identifier where you want to keep the
|
|
9
|
+
* first N and last M characters visible.
|
|
10
|
+
*
|
|
11
|
+
* - `strategy='segments'` — splits by a separator string (e.g. '/', '.', '-'),
|
|
12
|
+
* useful for file paths, domain names, or k8s resource names where segment
|
|
13
|
+
* boundaries are semantically meaningful.
|
|
14
|
+
*
|
|
15
|
+
* Uses CSS-only flex truncation: the `start` segment uses `flex-1 min-w-0 truncate`
|
|
16
|
+
* so the browser truncates it automatically when the container is too narrow.
|
|
17
|
+
* Zero JS measurement, zero ResizeObserver.
|
|
18
|
+
*
|
|
19
|
+
* @module @mks2508/mks-ui/react/ui/MiddleTruncate
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* // Hash truncation — preserve first 6 and last 4 chars
|
|
24
|
+
* <MiddleTruncate strategy="chars" text="0xABCDEF1234567890" keepStart={6} keepEnd={4} />
|
|
25
|
+
* // → 0xABCD…7890
|
|
26
|
+
* ```
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```tsx
|
|
30
|
+
* // File path — preserve filename + parent dir
|
|
31
|
+
* <MiddleTruncate
|
|
32
|
+
* strategy="segments"
|
|
33
|
+
* separator="/"
|
|
34
|
+
* text="src/components/Terminal/primitives/ChromeShell.tsx"
|
|
35
|
+
* keepEnd={2}
|
|
36
|
+
* />
|
|
37
|
+
* // → src/…/ChromeShell.tsx
|
|
38
|
+
* ```
|
|
39
|
+
*
|
|
40
|
+
* @example
|
|
41
|
+
* ```tsx
|
|
42
|
+
* // Domain — preserve root + TLD
|
|
43
|
+
* <MiddleTruncate
|
|
44
|
+
* strategy="segments"
|
|
45
|
+
* separator="."
|
|
46
|
+
* text="api.production.eu-west.example.com"
|
|
47
|
+
* keepStart={1}
|
|
48
|
+
* keepEnd={2}
|
|
49
|
+
* />
|
|
50
|
+
* // → api.…example.com
|
|
51
|
+
* ```
|
|
52
|
+
*
|
|
53
|
+
* @example
|
|
54
|
+
* ```tsx
|
|
55
|
+
* // With slot overrides for custom styling
|
|
56
|
+
* <MiddleTruncate
|
|
57
|
+
* strategy="segments"
|
|
58
|
+
* separator="/"
|
|
59
|
+
* text={path}
|
|
60
|
+
* keepEnd={2}
|
|
61
|
+
* slots={{
|
|
62
|
+
* start: 'text-muted-foreground/60',
|
|
63
|
+
* ellipsis: 'text-muted-foreground/40 mx-0.5',
|
|
64
|
+
* end: 'font-semibold text-foreground',
|
|
65
|
+
* }}
|
|
66
|
+
* />
|
|
67
|
+
* ```
|
|
68
|
+
*/
|
|
69
|
+
import type { IMiddleTruncateProps } from './MiddleTruncate.types';
|
|
70
|
+
/**
|
|
71
|
+
* Middle-truncates text, preserving start and/or end portions.
|
|
72
|
+
*
|
|
73
|
+
* @param props - See {@link IMiddleTruncateProps}
|
|
74
|
+
*/
|
|
75
|
+
export declare const MiddleTruncate: import("react").MemoExoticComponent<(props: IMiddleTruncateProps) => React.ReactElement>;
|
|
76
|
+
export { MiddleTruncateStyles, middleTruncateVariants, } from './MiddleTruncate.styles';
|
|
77
|
+
export type { TMiddleTruncateSlot } from './MiddleTruncate.styles';
|
|
78
|
+
export type { IMiddleTruncateProps } from './MiddleTruncate.types';
|
|
79
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/MiddleTruncate/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AAWH,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAEnE;;;;GAIG;AACH,eAAO,MAAM,cAAc,8CAClB,oBAAoB,KAC1B,KAAK,CAAC,YAAY,CAqBnB,CAAC;AA+FH,OAAO,EACL,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,yBAAyB,CAAC;AACjC,YAAY,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AACnE,YAAY,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}
|
|
@@ -0,0 +1,164 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { cn } from "../../lib/utils.js";
|
|
4
|
+
import { MiddleTruncateShortRootStyles, MiddleTruncateStyles, middleTruncateVariants } from "./MiddleTruncate.styles.js";
|
|
5
|
+
import { memo } from "react";
|
|
6
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
|
|
8
|
+
//#region src/react-ui/ui/MiddleTruncate/index.tsx
|
|
9
|
+
/**
|
|
10
|
+
* MiddleTruncate — CSS-only middle truncation primitive.
|
|
11
|
+
*
|
|
12
|
+
* Truncates text from the middle, preserving the start and/or end portions.
|
|
13
|
+
* Supports two strategies:
|
|
14
|
+
*
|
|
15
|
+
* - `strategy='chars'` — splits by individual characters, useful for hashes,
|
|
16
|
+
* UUIDs, commit SHAs, or any long identifier where you want to keep the
|
|
17
|
+
* first N and last M characters visible.
|
|
18
|
+
*
|
|
19
|
+
* - `strategy='segments'` — splits by a separator string (e.g. '/', '.', '-'),
|
|
20
|
+
* useful for file paths, domain names, or k8s resource names where segment
|
|
21
|
+
* boundaries are semantically meaningful.
|
|
22
|
+
*
|
|
23
|
+
* Uses CSS-only flex truncation: the `start` segment uses `flex-1 min-w-0 truncate`
|
|
24
|
+
* so the browser truncates it automatically when the container is too narrow.
|
|
25
|
+
* Zero JS measurement, zero ResizeObserver.
|
|
26
|
+
*
|
|
27
|
+
* @module @mks2508/mks-ui/react/ui/MiddleTruncate
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* // Hash truncation — preserve first 6 and last 4 chars
|
|
32
|
+
* <MiddleTruncate strategy="chars" text="0xABCDEF1234567890" keepStart={6} keepEnd={4} />
|
|
33
|
+
* // → 0xABCD…7890
|
|
34
|
+
* ```
|
|
35
|
+
*
|
|
36
|
+
* @example
|
|
37
|
+
* ```tsx
|
|
38
|
+
* // File path — preserve filename + parent dir
|
|
39
|
+
* <MiddleTruncate
|
|
40
|
+
* strategy="segments"
|
|
41
|
+
* separator="/"
|
|
42
|
+
* text="src/components/Terminal/primitives/ChromeShell.tsx"
|
|
43
|
+
* keepEnd={2}
|
|
44
|
+
* />
|
|
45
|
+
* // → src/…/ChromeShell.tsx
|
|
46
|
+
* ```
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```tsx
|
|
50
|
+
* // Domain — preserve root + TLD
|
|
51
|
+
* <MiddleTruncate
|
|
52
|
+
* strategy="segments"
|
|
53
|
+
* separator="."
|
|
54
|
+
* text="api.production.eu-west.example.com"
|
|
55
|
+
* keepStart={1}
|
|
56
|
+
* keepEnd={2}
|
|
57
|
+
* />
|
|
58
|
+
* // → api.…example.com
|
|
59
|
+
* ```
|
|
60
|
+
*
|
|
61
|
+
* @example
|
|
62
|
+
* ```tsx
|
|
63
|
+
* // With slot overrides for custom styling
|
|
64
|
+
* <MiddleTruncate
|
|
65
|
+
* strategy="segments"
|
|
66
|
+
* separator="/"
|
|
67
|
+
* text={path}
|
|
68
|
+
* keepEnd={2}
|
|
69
|
+
* slots={{
|
|
70
|
+
* start: 'text-muted-foreground/60',
|
|
71
|
+
* ellipsis: 'text-muted-foreground/40 mx-0.5',
|
|
72
|
+
* end: 'font-semibold text-foreground',
|
|
73
|
+
* }}
|
|
74
|
+
* />
|
|
75
|
+
* ```
|
|
76
|
+
*/
|
|
77
|
+
/**
|
|
78
|
+
* Middle-truncates text, preserving start and/or end portions.
|
|
79
|
+
*
|
|
80
|
+
* @param props - See {@link IMiddleTruncateProps}
|
|
81
|
+
*/
|
|
82
|
+
const MiddleTruncate = memo(function MiddleTruncate(props) {
|
|
83
|
+
const { text, strategy, keepStart = 0, keepEnd = strategy === "chars" ? 6 : 1, ellipsis = "…", title, className, slots } = props;
|
|
84
|
+
const tooltip = title ?? text;
|
|
85
|
+
if (strategy === "chars") return /* @__PURE__ */ jsx(CharTruncator, {
|
|
86
|
+
text,
|
|
87
|
+
keepStart,
|
|
88
|
+
keepEnd,
|
|
89
|
+
ellipsis,
|
|
90
|
+
tooltip,
|
|
91
|
+
className,
|
|
92
|
+
slots
|
|
93
|
+
});
|
|
94
|
+
const sep = props.separator;
|
|
95
|
+
return /* @__PURE__ */ jsx(SegmentTruncator, {
|
|
96
|
+
text,
|
|
97
|
+
separator: sep,
|
|
98
|
+
keepStart,
|
|
99
|
+
keepEnd,
|
|
100
|
+
ellipsis,
|
|
101
|
+
tooltip,
|
|
102
|
+
className,
|
|
103
|
+
slots
|
|
104
|
+
});
|
|
105
|
+
});
|
|
106
|
+
function CharTruncator({ text, keepStart, keepEnd, ellipsis, tooltip, className, slots }) {
|
|
107
|
+
if (text.length <= keepStart + keepEnd) return /* @__PURE__ */ jsx("span", {
|
|
108
|
+
className: cn(MiddleTruncateShortRootStyles, slots?.root, className),
|
|
109
|
+
title: tooltip,
|
|
110
|
+
children: text
|
|
111
|
+
});
|
|
112
|
+
const start = text.slice(0, keepStart);
|
|
113
|
+
const end = text.slice(-keepEnd);
|
|
114
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
115
|
+
className: cn(middleTruncateVariants(), slots?.root, className),
|
|
116
|
+
title: tooltip,
|
|
117
|
+
children: [
|
|
118
|
+
/* @__PURE__ */ jsx("span", {
|
|
119
|
+
className: cn(MiddleTruncateStyles.start, slots?.start),
|
|
120
|
+
children: start
|
|
121
|
+
}),
|
|
122
|
+
/* @__PURE__ */ jsx("span", {
|
|
123
|
+
className: cn(MiddleTruncateStyles.ellipsis, slots?.ellipsis),
|
|
124
|
+
children: ellipsis
|
|
125
|
+
}),
|
|
126
|
+
/* @__PURE__ */ jsx("span", {
|
|
127
|
+
className: cn(MiddleTruncateStyles.end, slots?.end),
|
|
128
|
+
children: end
|
|
129
|
+
})
|
|
130
|
+
]
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
function SegmentTruncator({ text, separator, keepStart, keepEnd, ellipsis, tooltip, className, slots }) {
|
|
134
|
+
const segments = text.split(separator);
|
|
135
|
+
if (segments.length <= keepStart + keepEnd) return /* @__PURE__ */ jsx("span", {
|
|
136
|
+
className: cn(MiddleTruncateShortRootStyles, slots?.root, className),
|
|
137
|
+
title: tooltip,
|
|
138
|
+
children: text
|
|
139
|
+
});
|
|
140
|
+
const endSegments = segments.slice(-keepEnd);
|
|
141
|
+
const start = segments.slice(0, -keepEnd).join(separator) + separator;
|
|
142
|
+
const end = endSegments.join(separator);
|
|
143
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
144
|
+
className: cn(middleTruncateVariants(), slots?.root, className),
|
|
145
|
+
title: tooltip,
|
|
146
|
+
children: [
|
|
147
|
+
/* @__PURE__ */ jsx("span", {
|
|
148
|
+
className: cn(MiddleTruncateStyles.start, slots?.start),
|
|
149
|
+
children: start
|
|
150
|
+
}),
|
|
151
|
+
/* @__PURE__ */ jsx("span", {
|
|
152
|
+
className: cn(MiddleTruncateStyles.ellipsis, slots?.ellipsis),
|
|
153
|
+
children: ellipsis
|
|
154
|
+
}),
|
|
155
|
+
/* @__PURE__ */ jsx("span", {
|
|
156
|
+
className: cn(MiddleTruncateStyles.end, slots?.end),
|
|
157
|
+
children: end
|
|
158
|
+
})
|
|
159
|
+
]
|
|
160
|
+
});
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
//#endregion
|
|
164
|
+
export { MiddleTruncate };
|
|
@@ -29,4 +29,4 @@ const middleTruncatePathVariants = cva(MiddleTruncatePathStyles.root, {
|
|
|
29
29
|
const MiddleTruncatePathShortRootStyles = "truncate";
|
|
30
30
|
|
|
31
31
|
//#endregion
|
|
32
|
-
export { MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles
|
|
32
|
+
export { MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles };
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* MiddleTruncatePath — CSS-only middle truncation for file paths.
|
|
3
3
|
*
|
|
4
|
+
* @deprecated Use `<MiddleTruncate strategy="segments" separator="/">` instead.
|
|
5
|
+
* Path-specific wrapper kept for backward compatibility. Will be removed in v0.11.
|
|
6
|
+
*
|
|
4
7
|
* Splits a path into a truncatable start and a fixed end
|
|
5
8
|
* (`parent/filename` by default). When space is limited, the start
|
|
6
9
|
* truncates with ellipsis while the end (the most identifiable part)
|
|
@@ -16,6 +19,9 @@ import type { IMiddleTruncatePathProps } from './MiddleTruncatePath.types';
|
|
|
16
19
|
/**
|
|
17
20
|
* Middle-truncates a file path, keeping the end segments visible.
|
|
18
21
|
*
|
|
22
|
+
* @deprecated Use `<MiddleTruncate strategy="segments" separator="/">` instead.
|
|
23
|
+
* This component is a thin path-specific wrapper and will be removed in v0.11.
|
|
24
|
+
*
|
|
19
25
|
* @param slots - Override Tailwind classes per visual slot
|
|
20
26
|
*
|
|
21
27
|
* @example
|
|
@@ -27,7 +33,7 @@ import type { IMiddleTruncatePathProps } from './MiddleTruncatePath.types';
|
|
|
27
33
|
* ```
|
|
28
34
|
*/
|
|
29
35
|
export declare const MiddleTruncatePath: import("react").MemoExoticComponent<({ path, keepEnd, className, startClassName, endClassName, slots, }: IMiddleTruncatePathProps) => import("react/jsx-runtime").JSX.Element>;
|
|
30
|
-
export { MiddleTruncatePathStyles,
|
|
36
|
+
export { MiddleTruncatePathStyles, MiddleTruncatePathShortRootStyles, } from './MiddleTruncatePath.styles';
|
|
31
37
|
export type { MiddleTruncatePathSlot } from './MiddleTruncatePath.styles';
|
|
32
38
|
export type { IMiddleTruncatePathProps } from './MiddleTruncatePath.types';
|
|
33
39
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/MiddleTruncatePath/index.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/MiddleTruncatePath/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAQH,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAE3E;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,kBAAkB,2GAO5B,wBAAwB,6CA6BzB,CAAC;AAEH,OAAO,EACL,wBAAwB,EACxB,iCAAiC,GAClC,MAAM,6BAA6B,CAAC;AACrC,YAAY,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAC1E,YAAY,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC"}
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
import { cn } from "../../lib/utils.js";
|
|
4
|
-
import {
|
|
4
|
+
import { MiddleTruncate } from "../MiddleTruncate/index.js";
|
|
5
|
+
import { MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles } from "./MiddleTruncatePath.styles.js";
|
|
5
6
|
import { memo } from "react";
|
|
6
|
-
import { jsx
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
7
8
|
|
|
8
9
|
//#region src/react-ui/ui/MiddleTruncatePath/index.tsx
|
|
9
10
|
/**
|
|
10
11
|
* MiddleTruncatePath — CSS-only middle truncation for file paths.
|
|
11
12
|
*
|
|
13
|
+
* @deprecated Use `<MiddleTruncate strategy="segments" separator="/">` instead.
|
|
14
|
+
* Path-specific wrapper kept for backward compatibility. Will be removed in v0.11.
|
|
15
|
+
*
|
|
12
16
|
* Splits a path into a truncatable start and a fixed end
|
|
13
17
|
* (`parent/filename` by default). When space is limited, the start
|
|
14
18
|
* truncates with ellipsis while the end (the most identifiable part)
|
|
@@ -23,6 +27,9 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
23
27
|
/**
|
|
24
28
|
* Middle-truncates a file path, keeping the end segments visible.
|
|
25
29
|
*
|
|
30
|
+
* @deprecated Use `<MiddleTruncate strategy="segments" separator="/">` instead.
|
|
31
|
+
* This component is a thin path-specific wrapper and will be removed in v0.11.
|
|
32
|
+
*
|
|
26
33
|
* @param slots - Override Tailwind classes per visual slot
|
|
27
34
|
*
|
|
28
35
|
* @example
|
|
@@ -34,25 +41,22 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
34
41
|
* ```
|
|
35
42
|
*/
|
|
36
43
|
const MiddleTruncatePath = memo(function MiddleTruncatePath({ path, keepEnd = 2, className, startClassName, endClassName, slots }) {
|
|
37
|
-
|
|
38
|
-
if (segments.length <= keepEnd) return /* @__PURE__ */ jsx("span", {
|
|
44
|
+
if (path.split("/").length <= keepEnd) return /* @__PURE__ */ jsx("span", {
|
|
39
45
|
className: cn(MiddleTruncatePathShortRootStyles, slots?.root, className),
|
|
40
46
|
title: path,
|
|
41
47
|
children: path
|
|
42
48
|
});
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
children: end
|
|
55
|
-
})]
|
|
49
|
+
return /* @__PURE__ */ jsx(MiddleTruncate, {
|
|
50
|
+
strategy: "segments",
|
|
51
|
+
separator: "/",
|
|
52
|
+
text: path,
|
|
53
|
+
keepEnd,
|
|
54
|
+
className,
|
|
55
|
+
slots: {
|
|
56
|
+
...slots,
|
|
57
|
+
start: cn(slots?.start, startClassName),
|
|
58
|
+
end: cn(slots?.end, endClassName)
|
|
59
|
+
}
|
|
56
60
|
});
|
|
57
61
|
});
|
|
58
62
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-ui/ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-ui/ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,iBAAiB,CAAC"}
|
|
@@ -38,7 +38,9 @@ import { fieldVariants } from "./Field/Field.styles.js";
|
|
|
38
38
|
import { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle } from "./Field/index.js";
|
|
39
39
|
import { FileIconStyles, FolderIconStyles, fileIconVariants, folderIconVariants } from "./FileIcon/FileIcon.styles.js";
|
|
40
40
|
import { FileIcon, FolderIcon } from "./FileIcon/index.js";
|
|
41
|
-
import {
|
|
41
|
+
import { MiddleTruncateStyles, middleTruncateVariants } from "./MiddleTruncate/MiddleTruncate.styles.js";
|
|
42
|
+
import { MiddleTruncate } from "./MiddleTruncate/index.js";
|
|
43
|
+
import { MiddleTruncatePathShortRootStyles, MiddleTruncatePathStyles } from "./MiddleTruncatePath/MiddleTruncatePath.styles.js";
|
|
42
44
|
import { MiddleTruncatePath } from "./MiddleTruncatePath/index.js";
|
|
43
45
|
import { FileItemGitStatusClasses, FileItemStyles, fileItemVariants } from "./FileItem/FileItem.styles.js";
|
|
44
46
|
import { FileItem } from "./FileItem/index.js";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mks2508/mks-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.0",
|
|
4
4
|
"description": "UI component library - Shadcn/Animate UI based with DevEnv components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -83,6 +83,26 @@
|
|
|
83
83
|
"import": "./dist/react-ui/blocks/Terminal/display.js",
|
|
84
84
|
"default": "./dist/react-ui/blocks/Terminal/display.js"
|
|
85
85
|
},
|
|
86
|
+
"./react/blocks/Terminal/xterm": {
|
|
87
|
+
"types": "./dist/react-ui/blocks/Terminal/xterm.d.ts",
|
|
88
|
+
"import": "./dist/react-ui/blocks/Terminal/xterm.js",
|
|
89
|
+
"default": "./dist/react-ui/blocks/Terminal/xterm.js"
|
|
90
|
+
},
|
|
91
|
+
"./react/blocks/Terminal/restty": {
|
|
92
|
+
"types": "./dist/react-ui/blocks/Terminal/restty.d.ts",
|
|
93
|
+
"import": "./dist/react-ui/blocks/Terminal/restty.js",
|
|
94
|
+
"default": "./dist/react-ui/blocks/Terminal/restty.js"
|
|
95
|
+
},
|
|
96
|
+
"./react/blocks/Terminal/wterm": {
|
|
97
|
+
"types": "./dist/react-ui/blocks/Terminal/wterm.d.ts",
|
|
98
|
+
"import": "./dist/react-ui/blocks/Terminal/wterm.js",
|
|
99
|
+
"default": "./dist/react-ui/blocks/Terminal/wterm.js"
|
|
100
|
+
},
|
|
101
|
+
"./react/blocks/Terminal/interactive": {
|
|
102
|
+
"types": "./dist/react-ui/blocks/Terminal/interactive.d.ts",
|
|
103
|
+
"import": "./dist/react-ui/blocks/Terminal/interactive.js",
|
|
104
|
+
"default": "./dist/react-ui/blocks/Terminal/interactive.js"
|
|
105
|
+
},
|
|
86
106
|
"./index.css": {
|
|
87
107
|
"import": "./dist/index.css",
|
|
88
108
|
"default": "./dist/index.css",
|