@cjlapao/ui-kit 0.2.3 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1205 -829
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +37 -0
- package/dist/index.d.cts +260 -44
- package/dist/index.d.ts +260 -44
- package/dist/index.js +1140 -767
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/CapsuleBlueprint--CgRT7dr.d.cts +0 -426
- package/dist/CapsuleBlueprint--CgRT7dr.d.ts +0 -426
- package/dist/CapsuleBlueprint-12uQWAvU.d.cts +0 -732
- package/dist/CapsuleBlueprint-12uQWAvU.d.ts +0 -732
- package/dist/CapsuleBlueprint-1FP6avn4.d.cts +0 -1017
- package/dist/CapsuleBlueprint-1FP6avn4.d.ts +0 -1017
- package/dist/CapsuleBlueprint-6DmJgar9.d.cts +0 -358
- package/dist/CapsuleBlueprint-6DmJgar9.d.ts +0 -358
- package/dist/CapsuleBlueprint-B7MPc5wu.d.cts +0 -835
- package/dist/CapsuleBlueprint-B7MPc5wu.d.ts +0 -835
- package/dist/CapsuleBlueprint-BFHAMKUF.d.cts +0 -991
- package/dist/CapsuleBlueprint-BFHAMKUF.d.ts +0 -991
- package/dist/CapsuleBlueprint-BG23ZWsl.d.cts +0 -460
- package/dist/CapsuleBlueprint-BG23ZWsl.d.ts +0 -460
- package/dist/CapsuleBlueprint-BGx-KPqS.d.cts +0 -925
- package/dist/CapsuleBlueprint-BGx-KPqS.d.ts +0 -925
- package/dist/CapsuleBlueprint-BJYVRyFD.d.cts +0 -449
- package/dist/CapsuleBlueprint-BJYVRyFD.d.ts +0 -449
- package/dist/CapsuleBlueprint-BQq4ywG4.d.cts +0 -835
- package/dist/CapsuleBlueprint-BQq4ywG4.d.ts +0 -835
- package/dist/CapsuleBlueprint-BTgmUcyF.d.cts +0 -278
- package/dist/CapsuleBlueprint-BTgmUcyF.d.ts +0 -278
- package/dist/CapsuleBlueprint-BX2YI1yC.d.cts +0 -415
- package/dist/CapsuleBlueprint-BX2YI1yC.d.ts +0 -415
- package/dist/CapsuleBlueprint-BfPODmvJ.d.cts +0 -822
- package/dist/CapsuleBlueprint-BfPODmvJ.d.ts +0 -822
- package/dist/CapsuleBlueprint-BfSPPu5k.d.cts +0 -616
- package/dist/CapsuleBlueprint-BfSPPu5k.d.ts +0 -616
- package/dist/CapsuleBlueprint-BoPkPR2J.d.cts +0 -785
- package/dist/CapsuleBlueprint-BoPkPR2J.d.ts +0 -785
- package/dist/CapsuleBlueprint-CJeLH0j2.d.cts +0 -228
- package/dist/CapsuleBlueprint-CJeLH0j2.d.ts +0 -228
- package/dist/CapsuleBlueprint-CJwXDMzM.d.cts +0 -622
- package/dist/CapsuleBlueprint-CJwXDMzM.d.ts +0 -622
- package/dist/CapsuleBlueprint-CM125BJI.d.cts +0 -811
- package/dist/CapsuleBlueprint-CM125BJI.d.ts +0 -811
- package/dist/CapsuleBlueprint-CQPeacGV.d.cts +0 -426
- package/dist/CapsuleBlueprint-CQPeacGV.d.ts +0 -426
- package/dist/CapsuleBlueprint-CQy2O0UN.d.cts +0 -889
- package/dist/CapsuleBlueprint-CQy2O0UN.d.ts +0 -889
- package/dist/CapsuleBlueprint-CRy04iCR.d.cts +0 -695
- package/dist/CapsuleBlueprint-CRy04iCR.d.ts +0 -695
- package/dist/CapsuleBlueprint-CixXdjMu.d.cts +0 -925
- package/dist/CapsuleBlueprint-CixXdjMu.d.ts +0 -925
- package/dist/CapsuleBlueprint-CjCxwO1O.d.cts +0 -786
- package/dist/CapsuleBlueprint-CjCxwO1O.d.ts +0 -786
- package/dist/CapsuleBlueprint-Cm10IA2w.d.cts +0 -342
- package/dist/CapsuleBlueprint-Cm10IA2w.d.ts +0 -342
- package/dist/CapsuleBlueprint-CoGsooJJ.d.cts +0 -492
- package/dist/CapsuleBlueprint-CoGsooJJ.d.ts +0 -492
- package/dist/CapsuleBlueprint-CpHqUsJK.d.cts +0 -786
- package/dist/CapsuleBlueprint-CpHqUsJK.d.ts +0 -786
- package/dist/CapsuleBlueprint-CrRg8EVW.d.cts +0 -358
- package/dist/CapsuleBlueprint-CrRg8EVW.d.ts +0 -358
- package/dist/CapsuleBlueprint-DGxsd0aY.d.cts +0 -785
- package/dist/CapsuleBlueprint-DGxsd0aY.d.ts +0 -785
- package/dist/CapsuleBlueprint-DYnwizSo.d.cts +0 -698
- package/dist/CapsuleBlueprint-DYnwizSo.d.ts +0 -698
- package/dist/CapsuleBlueprint-DbLSB78P.d.cts +0 -235
- package/dist/CapsuleBlueprint-DbLSB78P.d.ts +0 -235
- package/dist/CapsuleBlueprint-DfV8XBEZ.d.cts +0 -1001
- package/dist/CapsuleBlueprint-DfV8XBEZ.d.ts +0 -1001
- package/dist/CapsuleBlueprint-DiG1FUoM.d.cts +0 -757
- package/dist/CapsuleBlueprint-DiG1FUoM.d.ts +0 -757
- package/dist/CapsuleBlueprint-DvdeHC13.d.cts +0 -289
- package/dist/CapsuleBlueprint-DvdeHC13.d.ts +0 -289
- package/dist/CapsuleBlueprint-DvinXyHp.d.cts +0 -342
- package/dist/CapsuleBlueprint-DvinXyHp.d.ts +0 -342
- package/dist/CapsuleBlueprint-DwW8YOJg.d.cts +0 -925
- package/dist/CapsuleBlueprint-DwW8YOJg.d.ts +0 -925
- package/dist/CapsuleBlueprint-E069msDY.d.cts +0 -310
- package/dist/CapsuleBlueprint-E069msDY.d.ts +0 -310
- package/dist/CapsuleBlueprint-LECoxlXA.d.cts +0 -497
- package/dist/CapsuleBlueprint-LECoxlXA.d.ts +0 -497
- package/dist/CapsuleBlueprint-V9pDg6lh.d.cts +0 -247
- package/dist/CapsuleBlueprint-V9pDg6lh.d.ts +0 -247
- package/dist/CapsuleBlueprint-bOLrWbIc.d.cts +0 -858
- package/dist/CapsuleBlueprint-bOLrWbIc.d.ts +0 -858
- package/dist/CapsuleBlueprint-if_tP8K8.d.cts +0 -1022
- package/dist/CapsuleBlueprint-if_tP8K8.d.ts +0 -1022
- package/dist/CapsuleBlueprint-pP0Ima0I.d.cts +0 -768
- package/dist/CapsuleBlueprint-pP0Ima0I.d.ts +0 -768
- package/dist/CapsuleBlueprint-w82xP6zg.d.cts +0 -222
- package/dist/CapsuleBlueprint-w82xP6zg.d.ts +0 -222
- package/dist/CapsuleBlueprint-wdlxOX4L.d.cts +0 -472
- package/dist/CapsuleBlueprint-wdlxOX4L.d.ts +0 -472
- package/dist/CapsuleBlueprint-wxqu6jA3.d.cts +0 -529
- package/dist/CapsuleBlueprint-wxqu6jA3.d.ts +0 -529
|
@@ -1,222 +0,0 @@
|
|
|
1
|
-
import React__default from 'react';
|
|
2
|
-
|
|
3
|
-
type ButtonVariant = "solid" | "soft" | "outline" | "ghost" | "link" | "clear" | "icon" | "glass";
|
|
4
|
-
/**
|
|
5
|
-
* TrueColor is the only valid color type in the ui-kit theme system.
|
|
6
|
-
* It comprises 21 Tailwind palette color names (red through stone, including fuchsia and rose).
|
|
7
|
-
* All components, tokens, and utilities must use TrueColor exclusively.
|
|
8
|
-
*/
|
|
9
|
-
type TrueColor = "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "rose" | "slate" | "gray" | "zinc" | "neutral" | "stone";
|
|
10
|
-
/**
|
|
11
|
-
* Shared size type used across all frameworks and components.
|
|
12
|
-
* Replaces both the old ThemeSize (dead code) and ModalSize.
|
|
13
|
-
*/
|
|
14
|
-
type Size = "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "2xl" | "3xl" | "full";
|
|
15
|
-
type ButtonTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
16
|
-
type ButtonHoverTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
17
|
-
type ButtonActiveTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
18
|
-
type ButtonActiveHoverTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
19
|
-
type ToggleTheme = Record<TrueColor, string>;
|
|
20
|
-
type CheckboxTheme = Record<TrueColor, string>;
|
|
21
|
-
type SpinnerTheme = Record<TrueColor, [string, string, string, string]>;
|
|
22
|
-
type LoaderTheme = Record<TrueColor, {
|
|
23
|
-
track: string;
|
|
24
|
-
bar: string;
|
|
25
|
-
}>;
|
|
26
|
-
type MultiToggleTheme = Record<TrueColor, {
|
|
27
|
-
active: string;
|
|
28
|
-
activeText: string;
|
|
29
|
-
indicator: string;
|
|
30
|
-
hover: string;
|
|
31
|
-
}>;
|
|
32
|
-
type MultiToggleVariantTokens = {
|
|
33
|
-
softIndicator: string;
|
|
34
|
-
activeText: string;
|
|
35
|
-
hover: string;
|
|
36
|
-
};
|
|
37
|
-
type MultiToggleVariantTheme = Record<TrueColor, MultiToggleVariantTokens>;
|
|
38
|
-
type TabsColorTokens = {
|
|
39
|
-
hoverText: string;
|
|
40
|
-
activeText: string;
|
|
41
|
-
onAccentText: string;
|
|
42
|
-
focusRing: string;
|
|
43
|
-
accentBg: string;
|
|
44
|
-
subtleBg: string;
|
|
45
|
-
subtleHoverBg: string;
|
|
46
|
-
segmentedContainer: string;
|
|
47
|
-
badgeSubtle: string;
|
|
48
|
-
badgeStrong: string;
|
|
49
|
-
badgeOnAccent: string;
|
|
50
|
-
underlineActive: string;
|
|
51
|
-
};
|
|
52
|
-
type TabsTheme = Record<TrueColor, TabsColorTokens>;
|
|
53
|
-
type PanelToneConfig = {
|
|
54
|
-
border: string;
|
|
55
|
-
heading: string;
|
|
56
|
-
muted: string;
|
|
57
|
-
badge: string;
|
|
58
|
-
subtleBg: string;
|
|
59
|
-
tonalBg: string;
|
|
60
|
-
glassBg: string;
|
|
61
|
-
glassBorder: string;
|
|
62
|
-
liquidBg: string;
|
|
63
|
-
liquidBorder: string;
|
|
64
|
-
liquidShadow: string;
|
|
65
|
-
liquidHeading: string;
|
|
66
|
-
overlayGradient: string;
|
|
67
|
-
decorationShape: string;
|
|
68
|
-
decorationGradient: string;
|
|
69
|
-
};
|
|
70
|
-
type PanelTheme = Record<TrueColor, PanelToneConfig>;
|
|
71
|
-
type StepperToneConfig = {
|
|
72
|
-
activeBg: string;
|
|
73
|
-
activeText: string;
|
|
74
|
-
completedBg: string;
|
|
75
|
-
completedText: string;
|
|
76
|
-
pendingBorder: string;
|
|
77
|
-
pendingText: string;
|
|
78
|
-
underlineBase: string;
|
|
79
|
-
};
|
|
80
|
-
type StepperTheme = Record<TrueColor, StepperToneConfig>;
|
|
81
|
-
type BadgeTheme = Record<TrueColor, string>;
|
|
82
|
-
type PillTheme = Record<TrueColor, Record<"solid" | "soft" | "outline", {
|
|
83
|
-
base: string;
|
|
84
|
-
border?: string;
|
|
85
|
-
}>>;
|
|
86
|
-
type AlertTheme = Record<TrueColor, {
|
|
87
|
-
subtle: string;
|
|
88
|
-
solid: string;
|
|
89
|
-
outline: string;
|
|
90
|
-
icon: string;
|
|
91
|
-
text: string;
|
|
92
|
-
border: string;
|
|
93
|
-
dismiss: string;
|
|
94
|
-
}>;
|
|
95
|
-
type StatTileTheme = Record<TrueColor, {
|
|
96
|
-
decorationBg: string;
|
|
97
|
-
iconColor: string;
|
|
98
|
-
divider: string;
|
|
99
|
-
}>;
|
|
100
|
-
type ButtonSelectorColorTokens = {
|
|
101
|
-
selectedBorder: string;
|
|
102
|
-
selectedBg: string;
|
|
103
|
-
selectedIcon: string;
|
|
104
|
-
selectedLabel: string;
|
|
105
|
-
selectedIndicatorBg: string;
|
|
106
|
-
selectedIndicatorBorder: string;
|
|
107
|
-
selectedIndicatorDot: string;
|
|
108
|
-
};
|
|
109
|
-
type ButtonSelectorTheme = Record<TrueColor, ButtonSelectorColorTokens>;
|
|
110
|
-
interface ThemeDefinition {
|
|
111
|
-
button: ButtonTheme;
|
|
112
|
-
buttonHover: ButtonHoverTheme;
|
|
113
|
-
buttonActive: ButtonActiveTheme;
|
|
114
|
-
buttonActiveHover: ButtonActiveHoverTheme;
|
|
115
|
-
toggle: ToggleTheme;
|
|
116
|
-
checkbox: CheckboxTheme;
|
|
117
|
-
spinner: SpinnerTheme;
|
|
118
|
-
loader: LoaderTheme;
|
|
119
|
-
multiToggle: MultiToggleTheme;
|
|
120
|
-
multiToggleVariant: MultiToggleVariantTheme;
|
|
121
|
-
tabs: TabsTheme;
|
|
122
|
-
panel: PanelTheme;
|
|
123
|
-
stepper: StepperTheme;
|
|
124
|
-
badge: BadgeTheme;
|
|
125
|
-
pill: PillTheme;
|
|
126
|
-
alert: AlertTheme;
|
|
127
|
-
statTile: StatTileTheme;
|
|
128
|
-
buttonSelector: ButtonSelectorTheme;
|
|
129
|
-
}
|
|
130
|
-
type DeepPartial<T> = {
|
|
131
|
-
[K in keyof T]?: T[K] extends Record<string, unknown> ? DeepPartial<T[K]> : T[K];
|
|
132
|
-
};
|
|
133
|
-
declare const configureTheme: (overrides: DeepPartial<ThemeDefinition>) => void;
|
|
134
|
-
declare const resetTheme: () => void;
|
|
135
|
-
declare const getButtonColorClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
136
|
-
declare const getButtonHoverClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
137
|
-
declare const getButtonActiveClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
138
|
-
declare const getButtonActiveHoverClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
139
|
-
declare const getButtonBaseClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
140
|
-
declare const getToggleColorClasses: (color: TrueColor) => string;
|
|
141
|
-
declare const getCheckboxColorClasses: (color: TrueColor) => string;
|
|
142
|
-
declare const getSpinnerColorTokens: (color: TrueColor) => [string, string, string, string];
|
|
143
|
-
declare const getLoaderProgressColors: (color: TrueColor) => {
|
|
144
|
-
track: string;
|
|
145
|
-
bar: string;
|
|
146
|
-
};
|
|
147
|
-
declare const getMultiToggleColorTokens: (color: TrueColor) => {
|
|
148
|
-
active: string;
|
|
149
|
-
activeText: string;
|
|
150
|
-
indicator: string;
|
|
151
|
-
hover: string;
|
|
152
|
-
};
|
|
153
|
-
declare const getMultiToggleVariantTokens: (color: TrueColor) => MultiToggleVariantTokens;
|
|
154
|
-
declare const getTabsColorTokens: (color: TrueColor) => TabsColorTokens;
|
|
155
|
-
declare const getPanelToneStyles: (tone: TrueColor) => PanelToneConfig;
|
|
156
|
-
declare const getStepperTonePalette: (tone: TrueColor) => StepperToneConfig;
|
|
157
|
-
declare const getBadgeColorClasses: (color: TrueColor) => string;
|
|
158
|
-
declare const getPillColorClasses: (color: TrueColor, variant: "solid" | "soft" | "outline") => {
|
|
159
|
-
base: string;
|
|
160
|
-
border?: string;
|
|
161
|
-
};
|
|
162
|
-
declare const getAlertColorClasses: (color: TrueColor) => AlertTheme[TrueColor];
|
|
163
|
-
declare const getStatTileColorClasses: (color: TrueColor) => StatTileTheme[TrueColor];
|
|
164
|
-
|
|
165
|
-
type IconName = "Add" | "ArrowDown" | "ArrowLeft" | "ArrowRight" | "ArrowUp" | "Attached" | "Attachment" | "Back" | "Blueprint" | "Bug" | "Chat" | "CheckCircle" | "ChevronLeft" | "ChevronRight" | "Clean" | "Close" | "Close1" | "CloudOff" | "Cog" | "Complete" | "Container" | "CopyClipboard" | "Dashboard" | "Details" | "Docker copy" | "Docker" | "Dots" | "Download" | "Edit" | "Equal" | "Error" | "Export" | "EyeClosed" | "EyeOpen" | "Globe" | "Help" | "Idea" | "Image" | "Info" | "Key" | "LXC-Old" | "LXC" | "Log" | "Moon" | "Notification" | "Official" | "Offline" | "OpenApp" | "Parameter" | "Pause" | "Praise" | "ReportFeedback" | "Reset" | "Restart" | "Rocket" | "Run" | "Save" | "Scale" | "Script" | "Search" | "Send" | "Settings" | "Shop" | "Star" | "Stop" | "Sun" | "Suspend" | "ThemeAuto" | "ThemeDark" | "ThemeLight" | "Trash" | "UX" | "User" | "Users" | "Verified" | "ViewGrid" | "ViewRows" | "Library" | "Host" | "VirtualMachine" | "Role" | "Roles" | "Cache" | "Claim" | "Claims" | "KeyManagement" | "Windows" | "Ubuntu" | "Debian" | "Apple" | "KaliLinux" | "RedHat" | "Fedora" | "CentOS" | "Clone" | "Copy" | "Live" | "HealthCheck" | "ReverseProxy" | "ReverseProxyCORS" | "ReverseProxyRoutes" | "ReverseProxyFrom" | "ReverseProxyHeadersRequest" | "ReverseProxyHeadersResponse" | "ReverseProxyHTTP" | "ReverseProxyTo" | "ReverseProxyTLS" | "ReverseProxyTCP" | "Refresh" | "Calendar" | "Folder" | "Jobs" | "Warning" | "Artifactory" | "Azure" | "Minio" | "Aws" | "Orchestrator" | "Podman" | "PodmanDesktop" | "Group" | "Pin" | "Database" | "RemoteHost" | "Login" | "Logout" | "Snapshot" | "Revert" | "CleanBrush" | "Pull" | "Push" | "CatalogVersion" | "File" | "Revoke" | "Taint" | "Unlock" | "Check" | "ArrowChevronLeft" | "ArrowChevronRight" | "Drag";
|
|
166
|
-
declare const iconRegistry: Record<IconName, React__default.ForwardRefExoticComponent<React__default.SVGProps<SVGSVGElement>>>;
|
|
167
|
-
|
|
168
|
-
type HelpButtonPlacement = "top" | "bottom" | "left" | "right" | "auto";
|
|
169
|
-
interface HelpButtonProps {
|
|
170
|
-
/**
|
|
171
|
-
* Help content to display in the panel.
|
|
172
|
-
* Pass a `string` to render as Markdown (tables and URLs supported).
|
|
173
|
-
* Pass a `ReactNode` to render arbitrary JSX directly.
|
|
174
|
-
*/
|
|
175
|
-
content: string | React__default.ReactNode;
|
|
176
|
-
/** Optional title shown in the panel header. Defaults to "Help". */
|
|
177
|
-
title?: React__default.ReactNode;
|
|
178
|
-
/**
|
|
179
|
-
* Preferred placement of the floating panel relative to the trigger button.
|
|
180
|
-
* "auto" (default) picks the side with the most available space.
|
|
181
|
-
*/
|
|
182
|
-
placement?: HelpButtonPlacement;
|
|
183
|
-
/** Accent color for the trigger button and the panel header stripe. */
|
|
184
|
-
color?: TrueColor;
|
|
185
|
-
/** Size of the trigger icon button. */
|
|
186
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
187
|
-
/** Icon for the trigger button. Defaults to "Help". */
|
|
188
|
-
icon?: IconName;
|
|
189
|
-
/** Maximum width of the floating panel in px. Defaults to 360. */
|
|
190
|
-
maxWidth?: number;
|
|
191
|
-
/** Extra class applied to the root wrapper. */
|
|
192
|
-
className?: string;
|
|
193
|
-
}
|
|
194
|
-
declare const HelpButton: React__default.FC<HelpButtonProps>;
|
|
195
|
-
|
|
196
|
-
declare enum CapsuleBlueprintValueType {
|
|
197
|
-
String = "string",
|
|
198
|
-
Int = "int",
|
|
199
|
-
Boolean = "boolean",
|
|
200
|
-
Select = "select",
|
|
201
|
-
List = "list",
|
|
202
|
-
Map = "map"
|
|
203
|
-
}
|
|
204
|
-
interface CapsuleBlueprintParameter {
|
|
205
|
-
name: string;
|
|
206
|
-
key: string;
|
|
207
|
-
description?: string;
|
|
208
|
-
type?: string;
|
|
209
|
-
value_type?: CapsuleBlueprintValueType;
|
|
210
|
-
default?: any;
|
|
211
|
-
required?: boolean;
|
|
212
|
-
is_required?: boolean;
|
|
213
|
-
is_secret?: boolean;
|
|
214
|
-
options?: any;
|
|
215
|
-
hint?: string;
|
|
216
|
-
help?: string;
|
|
217
|
-
service_name?: string;
|
|
218
|
-
depends_on?: string[];
|
|
219
|
-
[key: string]: any;
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
export { type ButtonVariant as B, type CapsuleBlueprintParameter as C, type HelpButtonProps as H, type IconName as I, type Size as S, type TrueColor as T, CapsuleBlueprintValueType as a, getBadgeColorClasses as b, configureTheme as c, getButtonActiveClasses as d, getButtonActiveHoverClasses as e, getButtonBaseClasses as f, getAlertColorClasses as g, getButtonColorClasses as h, getButtonHoverClasses as i, getCheckboxColorClasses as j, getLoaderProgressColors as k, getMultiToggleColorTokens as l, getMultiToggleVariantTokens as m, getPanelToneStyles as n, getPillColorClasses as o, getSpinnerColorTokens as p, getStatTileColorClasses as q, getStepperTonePalette as r, getTabsColorTokens as s, getToggleColorClasses as t, iconRegistry as u, resetTheme as v, HelpButton as w };
|
|
@@ -1,222 +0,0 @@
|
|
|
1
|
-
import React__default from 'react';
|
|
2
|
-
|
|
3
|
-
type ButtonVariant = "solid" | "soft" | "outline" | "ghost" | "link" | "clear" | "icon" | "glass";
|
|
4
|
-
/**
|
|
5
|
-
* TrueColor is the only valid color type in the ui-kit theme system.
|
|
6
|
-
* It comprises 21 Tailwind palette color names (red through stone, including fuchsia and rose).
|
|
7
|
-
* All components, tokens, and utilities must use TrueColor exclusively.
|
|
8
|
-
*/
|
|
9
|
-
type TrueColor = "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "rose" | "slate" | "gray" | "zinc" | "neutral" | "stone";
|
|
10
|
-
/**
|
|
11
|
-
* Shared size type used across all frameworks and components.
|
|
12
|
-
* Replaces both the old ThemeSize (dead code) and ModalSize.
|
|
13
|
-
*/
|
|
14
|
-
type Size = "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "2xl" | "3xl" | "full";
|
|
15
|
-
type ButtonTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
16
|
-
type ButtonHoverTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
17
|
-
type ButtonActiveTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
18
|
-
type ButtonActiveHoverTheme = Record<ButtonVariant, Record<TrueColor, string>>;
|
|
19
|
-
type ToggleTheme = Record<TrueColor, string>;
|
|
20
|
-
type CheckboxTheme = Record<TrueColor, string>;
|
|
21
|
-
type SpinnerTheme = Record<TrueColor, [string, string, string, string]>;
|
|
22
|
-
type LoaderTheme = Record<TrueColor, {
|
|
23
|
-
track: string;
|
|
24
|
-
bar: string;
|
|
25
|
-
}>;
|
|
26
|
-
type MultiToggleTheme = Record<TrueColor, {
|
|
27
|
-
active: string;
|
|
28
|
-
activeText: string;
|
|
29
|
-
indicator: string;
|
|
30
|
-
hover: string;
|
|
31
|
-
}>;
|
|
32
|
-
type MultiToggleVariantTokens = {
|
|
33
|
-
softIndicator: string;
|
|
34
|
-
activeText: string;
|
|
35
|
-
hover: string;
|
|
36
|
-
};
|
|
37
|
-
type MultiToggleVariantTheme = Record<TrueColor, MultiToggleVariantTokens>;
|
|
38
|
-
type TabsColorTokens = {
|
|
39
|
-
hoverText: string;
|
|
40
|
-
activeText: string;
|
|
41
|
-
onAccentText: string;
|
|
42
|
-
focusRing: string;
|
|
43
|
-
accentBg: string;
|
|
44
|
-
subtleBg: string;
|
|
45
|
-
subtleHoverBg: string;
|
|
46
|
-
segmentedContainer: string;
|
|
47
|
-
badgeSubtle: string;
|
|
48
|
-
badgeStrong: string;
|
|
49
|
-
badgeOnAccent: string;
|
|
50
|
-
underlineActive: string;
|
|
51
|
-
};
|
|
52
|
-
type TabsTheme = Record<TrueColor, TabsColorTokens>;
|
|
53
|
-
type PanelToneConfig = {
|
|
54
|
-
border: string;
|
|
55
|
-
heading: string;
|
|
56
|
-
muted: string;
|
|
57
|
-
badge: string;
|
|
58
|
-
subtleBg: string;
|
|
59
|
-
tonalBg: string;
|
|
60
|
-
glassBg: string;
|
|
61
|
-
glassBorder: string;
|
|
62
|
-
liquidBg: string;
|
|
63
|
-
liquidBorder: string;
|
|
64
|
-
liquidShadow: string;
|
|
65
|
-
liquidHeading: string;
|
|
66
|
-
overlayGradient: string;
|
|
67
|
-
decorationShape: string;
|
|
68
|
-
decorationGradient: string;
|
|
69
|
-
};
|
|
70
|
-
type PanelTheme = Record<TrueColor, PanelToneConfig>;
|
|
71
|
-
type StepperToneConfig = {
|
|
72
|
-
activeBg: string;
|
|
73
|
-
activeText: string;
|
|
74
|
-
completedBg: string;
|
|
75
|
-
completedText: string;
|
|
76
|
-
pendingBorder: string;
|
|
77
|
-
pendingText: string;
|
|
78
|
-
underlineBase: string;
|
|
79
|
-
};
|
|
80
|
-
type StepperTheme = Record<TrueColor, StepperToneConfig>;
|
|
81
|
-
type BadgeTheme = Record<TrueColor, string>;
|
|
82
|
-
type PillTheme = Record<TrueColor, Record<"solid" | "soft" | "outline", {
|
|
83
|
-
base: string;
|
|
84
|
-
border?: string;
|
|
85
|
-
}>>;
|
|
86
|
-
type AlertTheme = Record<TrueColor, {
|
|
87
|
-
subtle: string;
|
|
88
|
-
solid: string;
|
|
89
|
-
outline: string;
|
|
90
|
-
icon: string;
|
|
91
|
-
text: string;
|
|
92
|
-
border: string;
|
|
93
|
-
dismiss: string;
|
|
94
|
-
}>;
|
|
95
|
-
type StatTileTheme = Record<TrueColor, {
|
|
96
|
-
decorationBg: string;
|
|
97
|
-
iconColor: string;
|
|
98
|
-
divider: string;
|
|
99
|
-
}>;
|
|
100
|
-
type ButtonSelectorColorTokens = {
|
|
101
|
-
selectedBorder: string;
|
|
102
|
-
selectedBg: string;
|
|
103
|
-
selectedIcon: string;
|
|
104
|
-
selectedLabel: string;
|
|
105
|
-
selectedIndicatorBg: string;
|
|
106
|
-
selectedIndicatorBorder: string;
|
|
107
|
-
selectedIndicatorDot: string;
|
|
108
|
-
};
|
|
109
|
-
type ButtonSelectorTheme = Record<TrueColor, ButtonSelectorColorTokens>;
|
|
110
|
-
interface ThemeDefinition {
|
|
111
|
-
button: ButtonTheme;
|
|
112
|
-
buttonHover: ButtonHoverTheme;
|
|
113
|
-
buttonActive: ButtonActiveTheme;
|
|
114
|
-
buttonActiveHover: ButtonActiveHoverTheme;
|
|
115
|
-
toggle: ToggleTheme;
|
|
116
|
-
checkbox: CheckboxTheme;
|
|
117
|
-
spinner: SpinnerTheme;
|
|
118
|
-
loader: LoaderTheme;
|
|
119
|
-
multiToggle: MultiToggleTheme;
|
|
120
|
-
multiToggleVariant: MultiToggleVariantTheme;
|
|
121
|
-
tabs: TabsTheme;
|
|
122
|
-
panel: PanelTheme;
|
|
123
|
-
stepper: StepperTheme;
|
|
124
|
-
badge: BadgeTheme;
|
|
125
|
-
pill: PillTheme;
|
|
126
|
-
alert: AlertTheme;
|
|
127
|
-
statTile: StatTileTheme;
|
|
128
|
-
buttonSelector: ButtonSelectorTheme;
|
|
129
|
-
}
|
|
130
|
-
type DeepPartial<T> = {
|
|
131
|
-
[K in keyof T]?: T[K] extends Record<string, unknown> ? DeepPartial<T[K]> : T[K];
|
|
132
|
-
};
|
|
133
|
-
declare const configureTheme: (overrides: DeepPartial<ThemeDefinition>) => void;
|
|
134
|
-
declare const resetTheme: () => void;
|
|
135
|
-
declare const getButtonColorClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
136
|
-
declare const getButtonHoverClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
137
|
-
declare const getButtonActiveClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
138
|
-
declare const getButtonActiveHoverClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
139
|
-
declare const getButtonBaseClasses: (variant: ButtonVariant, color: TrueColor) => string;
|
|
140
|
-
declare const getToggleColorClasses: (color: TrueColor) => string;
|
|
141
|
-
declare const getCheckboxColorClasses: (color: TrueColor) => string;
|
|
142
|
-
declare const getSpinnerColorTokens: (color: TrueColor) => [string, string, string, string];
|
|
143
|
-
declare const getLoaderProgressColors: (color: TrueColor) => {
|
|
144
|
-
track: string;
|
|
145
|
-
bar: string;
|
|
146
|
-
};
|
|
147
|
-
declare const getMultiToggleColorTokens: (color: TrueColor) => {
|
|
148
|
-
active: string;
|
|
149
|
-
activeText: string;
|
|
150
|
-
indicator: string;
|
|
151
|
-
hover: string;
|
|
152
|
-
};
|
|
153
|
-
declare const getMultiToggleVariantTokens: (color: TrueColor) => MultiToggleVariantTokens;
|
|
154
|
-
declare const getTabsColorTokens: (color: TrueColor) => TabsColorTokens;
|
|
155
|
-
declare const getPanelToneStyles: (tone: TrueColor) => PanelToneConfig;
|
|
156
|
-
declare const getStepperTonePalette: (tone: TrueColor) => StepperToneConfig;
|
|
157
|
-
declare const getBadgeColorClasses: (color: TrueColor) => string;
|
|
158
|
-
declare const getPillColorClasses: (color: TrueColor, variant: "solid" | "soft" | "outline") => {
|
|
159
|
-
base: string;
|
|
160
|
-
border?: string;
|
|
161
|
-
};
|
|
162
|
-
declare const getAlertColorClasses: (color: TrueColor) => AlertTheme[TrueColor];
|
|
163
|
-
declare const getStatTileColorClasses: (color: TrueColor) => StatTileTheme[TrueColor];
|
|
164
|
-
|
|
165
|
-
type IconName = "Add" | "ArrowDown" | "ArrowLeft" | "ArrowRight" | "ArrowUp" | "Attached" | "Attachment" | "Back" | "Blueprint" | "Bug" | "Chat" | "CheckCircle" | "ChevronLeft" | "ChevronRight" | "Clean" | "Close" | "Close1" | "CloudOff" | "Cog" | "Complete" | "Container" | "CopyClipboard" | "Dashboard" | "Details" | "Docker copy" | "Docker" | "Dots" | "Download" | "Edit" | "Equal" | "Error" | "Export" | "EyeClosed" | "EyeOpen" | "Globe" | "Help" | "Idea" | "Image" | "Info" | "Key" | "LXC-Old" | "LXC" | "Log" | "Moon" | "Notification" | "Official" | "Offline" | "OpenApp" | "Parameter" | "Pause" | "Praise" | "ReportFeedback" | "Reset" | "Restart" | "Rocket" | "Run" | "Save" | "Scale" | "Script" | "Search" | "Send" | "Settings" | "Shop" | "Star" | "Stop" | "Sun" | "Suspend" | "ThemeAuto" | "ThemeDark" | "ThemeLight" | "Trash" | "UX" | "User" | "Users" | "Verified" | "ViewGrid" | "ViewRows" | "Library" | "Host" | "VirtualMachine" | "Role" | "Roles" | "Cache" | "Claim" | "Claims" | "KeyManagement" | "Windows" | "Ubuntu" | "Debian" | "Apple" | "KaliLinux" | "RedHat" | "Fedora" | "CentOS" | "Clone" | "Copy" | "Live" | "HealthCheck" | "ReverseProxy" | "ReverseProxyCORS" | "ReverseProxyRoutes" | "ReverseProxyFrom" | "ReverseProxyHeadersRequest" | "ReverseProxyHeadersResponse" | "ReverseProxyHTTP" | "ReverseProxyTo" | "ReverseProxyTLS" | "ReverseProxyTCP" | "Refresh" | "Calendar" | "Folder" | "Jobs" | "Warning" | "Artifactory" | "Azure" | "Minio" | "Aws" | "Orchestrator" | "Podman" | "PodmanDesktop" | "Group" | "Pin" | "Database" | "RemoteHost" | "Login" | "Logout" | "Snapshot" | "Revert" | "CleanBrush" | "Pull" | "Push" | "CatalogVersion" | "File" | "Revoke" | "Taint" | "Unlock" | "Check" | "ArrowChevronLeft" | "ArrowChevronRight" | "Drag";
|
|
166
|
-
declare const iconRegistry: Record<IconName, React__default.ForwardRefExoticComponent<React__default.SVGProps<SVGSVGElement>>>;
|
|
167
|
-
|
|
168
|
-
type HelpButtonPlacement = "top" | "bottom" | "left" | "right" | "auto";
|
|
169
|
-
interface HelpButtonProps {
|
|
170
|
-
/**
|
|
171
|
-
* Help content to display in the panel.
|
|
172
|
-
* Pass a `string` to render as Markdown (tables and URLs supported).
|
|
173
|
-
* Pass a `ReactNode` to render arbitrary JSX directly.
|
|
174
|
-
*/
|
|
175
|
-
content: string | React__default.ReactNode;
|
|
176
|
-
/** Optional title shown in the panel header. Defaults to "Help". */
|
|
177
|
-
title?: React__default.ReactNode;
|
|
178
|
-
/**
|
|
179
|
-
* Preferred placement of the floating panel relative to the trigger button.
|
|
180
|
-
* "auto" (default) picks the side with the most available space.
|
|
181
|
-
*/
|
|
182
|
-
placement?: HelpButtonPlacement;
|
|
183
|
-
/** Accent color for the trigger button and the panel header stripe. */
|
|
184
|
-
color?: TrueColor;
|
|
185
|
-
/** Size of the trigger icon button. */
|
|
186
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
187
|
-
/** Icon for the trigger button. Defaults to "Help". */
|
|
188
|
-
icon?: IconName;
|
|
189
|
-
/** Maximum width of the floating panel in px. Defaults to 360. */
|
|
190
|
-
maxWidth?: number;
|
|
191
|
-
/** Extra class applied to the root wrapper. */
|
|
192
|
-
className?: string;
|
|
193
|
-
}
|
|
194
|
-
declare const HelpButton: React__default.FC<HelpButtonProps>;
|
|
195
|
-
|
|
196
|
-
declare enum CapsuleBlueprintValueType {
|
|
197
|
-
String = "string",
|
|
198
|
-
Int = "int",
|
|
199
|
-
Boolean = "boolean",
|
|
200
|
-
Select = "select",
|
|
201
|
-
List = "list",
|
|
202
|
-
Map = "map"
|
|
203
|
-
}
|
|
204
|
-
interface CapsuleBlueprintParameter {
|
|
205
|
-
name: string;
|
|
206
|
-
key: string;
|
|
207
|
-
description?: string;
|
|
208
|
-
type?: string;
|
|
209
|
-
value_type?: CapsuleBlueprintValueType;
|
|
210
|
-
default?: any;
|
|
211
|
-
required?: boolean;
|
|
212
|
-
is_required?: boolean;
|
|
213
|
-
is_secret?: boolean;
|
|
214
|
-
options?: any;
|
|
215
|
-
hint?: string;
|
|
216
|
-
help?: string;
|
|
217
|
-
service_name?: string;
|
|
218
|
-
depends_on?: string[];
|
|
219
|
-
[key: string]: any;
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
export { type ButtonVariant as B, type CapsuleBlueprintParameter as C, type HelpButtonProps as H, type IconName as I, type Size as S, type TrueColor as T, CapsuleBlueprintValueType as a, getBadgeColorClasses as b, configureTheme as c, getButtonActiveClasses as d, getButtonActiveHoverClasses as e, getButtonBaseClasses as f, getAlertColorClasses as g, getButtonColorClasses as h, getButtonHoverClasses as i, getCheckboxColorClasses as j, getLoaderProgressColors as k, getMultiToggleColorTokens as l, getMultiToggleVariantTokens as m, getPanelToneStyles as n, getPillColorClasses as o, getSpinnerColorTokens as p, getStatTileColorClasses as q, getStepperTonePalette as r, getTabsColorTokens as s, getToggleColorClasses as t, iconRegistry as u, resetTheme as v, HelpButton as w };
|