@mechane-ai/ui 0.2.2 → 0.3.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/README.md +34 -13
- package/dist/ai.js +315 -0
- package/dist/assets/stylex.css +1533 -360
- package/dist/cartesian-Bwt6ZnF5.js +847 -0
- package/dist/chart-input-Bti0gyzz.js +173 -0
- package/dist/charts/cartesian.js +1 -0
- package/dist/charts/distribution.js +1 -0
- package/dist/charts/graph.js +1 -0
- package/dist/charts/matrix.js +1 -0
- package/dist/charts.js +98 -93
- package/dist/code-BJp-g4Fw.js +172 -0
- package/dist/collections.js +666 -0
- package/dist/content/code.js +1 -0
- package/dist/content/diff.js +101 -0
- package/dist/content/link.js +1 -0
- package/dist/content/tree.js +77 -0
- package/dist/content-link-52aZVX3X.js +26 -0
- package/dist/content.js +367 -0
- package/dist/distribution-CViLvcPP.js +609 -0
- package/dist/graph-DAfo72ZD.js +230 -0
- package/dist/index.js +1 -1
- package/dist/layout.js +201 -160
- package/dist/matrix-B9dybkce.js +785 -0
- package/dist/packages/ai/src/approval.d.ts +29 -0
- package/dist/packages/ai/src/conversation.d.ts +34 -0
- package/dist/packages/ai/src/index.d.ts +10 -0
- package/dist/packages/ai/src/message.d.ts +19 -0
- package/dist/packages/ai/src/prompt-input.d.ts +25 -0
- package/dist/packages/ai/src/sources.d.ts +17 -0
- package/dist/packages/charts/src/cartesian/categorical.d.ts +43 -0
- package/dist/packages/charts/src/cartesian/index.d.ts +8 -0
- package/dist/packages/charts/src/cartesian/sparkline.d.ts +11 -0
- package/dist/packages/charts/src/cartesian/time-series-data.d.ts +54 -0
- package/dist/packages/charts/src/cartesian/time-series-line.d.ts +9 -0
- package/dist/packages/charts/src/cartesian/time-series.d.ts +29 -0
- package/dist/packages/charts/src/chart-frame.d.ts +34 -0
- package/dist/packages/charts/src/chart-input.d.ts +10 -0
- package/dist/packages/charts/src/chart-theme.d.ts +48 -0
- package/dist/packages/charts/src/distribution/distribution-input.d.ts +14 -0
- package/dist/packages/charts/src/distribution/distribution-plot.d.ts +135 -0
- package/dist/packages/charts/src/distribution/ecdf.d.ts +23 -0
- package/dist/packages/charts/src/distribution/histogram.d.ts +26 -0
- package/dist/packages/charts/src/distribution/index.d.ts +8 -0
- package/dist/packages/charts/src/distribution/interval-plot.d.ts +24 -0
- package/dist/packages/charts/src/distribution/ranked-bars.d.ts +22 -0
- package/dist/packages/charts/src/graph/index.d.ts +2 -0
- package/dist/packages/charts/src/graph/relation-graph.d.ts +45 -0
- package/dist/packages/charts/src/index.d.ts +13 -0
- package/dist/packages/charts/src/matrix/color-legend.d.ts +7 -0
- package/dist/packages/charts/src/matrix/heatmap-scale.d.ts +8 -0
- package/dist/packages/charts/src/matrix/index.d.ts +9 -0
- package/dist/packages/charts/src/matrix/matrix.d.ts +34 -0
- package/dist/packages/charts/src/matrix/scatter-plot.d.ts +37 -0
- package/dist/packages/charts/src/matrix/token-heatmap.d.ts +20 -0
- package/dist/packages/charts/src/plot-width.d.ts +5 -0
- package/dist/packages/collections/src/calendar.d.ts +32 -0
- package/dist/packages/collections/src/collection-controls.d.ts +41 -0
- package/dist/packages/collections/src/command.d.ts +37 -0
- package/dist/packages/collections/src/data-table.d.ts +49 -0
- package/dist/packages/collections/src/date-range-picker.d.ts +16 -0
- package/dist/packages/collections/src/index.d.ts +13 -0
- package/dist/packages/content/src/code/code-block.d.ts +22 -0
- package/dist/packages/content/src/code/index.d.ts +2 -0
- package/dist/packages/content/src/code/use-highlighted-code.d.ts +9 -0
- package/dist/packages/content/src/content-link.d.ts +8 -0
- package/dist/packages/content/src/diff/diff-source.d.ts +32 -0
- package/dist/packages/content/src/diff/diff-viewer.d.ts +3 -0
- package/dist/packages/content/src/diff/index.d.ts +2 -0
- package/dist/packages/content/src/diff/pierre-diff.d.ts +14 -0
- package/dist/packages/content/src/index.d.ts +10 -0
- package/dist/packages/content/src/json-viewer.d.ts +11 -0
- package/dist/packages/content/src/link.d.ts +2 -0
- package/dist/packages/content/src/log-viewer.d.ts +9 -0
- package/dist/packages/content/src/markdown.d.ts +7 -0
- package/dist/packages/content/src/pierre-theme.d.ts +36 -0
- package/dist/packages/content/src/stack-trace.d.ts +16 -0
- package/dist/packages/content/src/tree/file-tree-types.d.ts +12 -0
- package/dist/packages/content/src/tree/file-tree.d.ts +3 -0
- package/dist/packages/content/src/tree/index.d.ts +2 -0
- package/dist/packages/content/src/tree/pierre-tree.d.ts +3 -0
- package/dist/packages/core/src/alert-dialog.d.ts +18 -0
- package/dist/packages/core/src/combobox.d.ts +81 -0
- package/dist/{control-state.d.ts → packages/core/src/control-state.d.ts} +18 -2
- package/dist/{copy-value.d.ts → packages/core/src/copy-value.d.ts} +2 -1
- package/dist/packages/core/src/details-controls.d.ts +23 -0
- package/dist/packages/core/src/disclosure.d.ts +33 -0
- package/dist/packages/core/src/field-styles.d.ts +66 -0
- package/dist/packages/core/src/form-controls.d.ts +81 -0
- package/dist/{forms.d.ts → packages/core/src/forms.d.ts} +1 -1
- package/dist/packages/core/src/index.d.ts +32 -0
- package/dist/packages/core/src/menu.d.ts +51 -0
- package/dist/packages/core/src/navigation.d.ts +24 -0
- package/dist/packages/core/src/popover.d.ts +24 -0
- package/dist/packages/core/src/popup-styles.d.ts +84 -0
- package/dist/packages/core/src/preview.d.ts +17 -0
- package/dist/packages/core/src/progress.d.ts +10 -0
- package/dist/packages/core/src/selection-styles.d.ts +110 -0
- package/dist/packages/core/src/selection.d.ts +57 -0
- package/dist/packages/core/src/skeleton.d.ts +18 -0
- package/dist/packages/core/src/theme.d.ts +16 -0
- package/dist/packages/core/src/toast.d.ts +28 -0
- package/dist/{tokens.stylex.d.ts → packages/core/src/tokens.stylex.d.ts} +60 -0
- package/dist/packages/core/src/trace.d.ts +35 -0
- package/dist/{layout → packages/layout/src}/index.d.ts +2 -0
- package/dist/{layout → packages/layout/src}/page-toolbar.d.ts +1 -1
- package/dist/packages/layout/src/resizable.d.ts +27 -0
- package/dist/{layout → packages/layout/src}/sidebar.d.ts +1 -1
- package/dist/pierre-diff-D3m4JCu0.js +66 -0
- package/dist/pierre-theme-CPlfl-AA.js +96 -0
- package/dist/pierre-tree-BaEkz16y.js +105 -0
- package/dist/plot-width--OgdohB5.js +18 -0
- package/dist/src-E7YRJBMO.js +2821 -0
- package/dist/tokens.js +118 -64
- package/package.json +67 -10
- package/{src → packages/core/src}/tokens.stylex.ts +64 -0
- package/dist/charts/index.d.ts +0 -2
- package/dist/index.d.ts +0 -16
- package/dist/src-Czfi0YQa.js +0 -1319
- /package/dist/{charts → packages/charts/src}/waterfall.d.ts +0 -0
- /package/dist/{inspector.d.ts → packages/collections/src/inspector.d.ts} +0 -0
- /package/dist/{list-footer.d.ts → packages/collections/src/list-footer.d.ts} +0 -0
- /package/dist/{table.d.ts → packages/collections/src/table.d.ts} +0 -0
- /package/dist/{accessibility.d.ts → packages/core/src/accessibility.d.ts} +0 -0
- /package/dist/{actions.d.ts → packages/core/src/actions.d.ts} +0 -0
- /package/dist/{dialog.d.ts → packages/core/src/dialog.d.ts} +0 -0
- /package/dist/{drawer.d.ts → packages/core/src/drawer.d.ts} +0 -0
- /package/dist/{loading.d.ts → packages/core/src/loading.d.ts} +0 -0
- /package/dist/{metrics.d.ts → packages/core/src/metrics.d.ts} +0 -0
- /package/dist/{overlay-styles.d.ts → packages/core/src/overlay-styles.d.ts} +0 -0
- /package/dist/{select.d.ts → packages/core/src/select.d.ts} +0 -0
- /package/dist/{skip-link.d.ts → packages/core/src/skip-link.d.ts} +0 -0
- /package/dist/{style-composition.d.ts → packages/core/src/style-composition.d.ts} +0 -0
- /package/dist/{surfaces.d.ts → packages/core/src/surfaces.d.ts} +0 -0
- /package/dist/{tabs.d.ts → packages/core/src/tabs.d.ts} +0 -0
- /package/dist/{text.d.ts → packages/core/src/text.d.ts} +0 -0
- /package/dist/{tooltip.d.ts → packages/core/src/tooltip.d.ts} +0 -0
- /package/dist/{layout → packages/layout/src}/app-shell.d.ts +0 -0
- /package/dist/{layout → packages/layout/src}/detail-page.d.ts +0 -0
- /package/dist/{layout → packages/layout/src}/frame.stylex.d.ts +0 -0
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import * as stylex from '@stylexjs/stylex';
|
|
2
|
+
import { conditions } from './tokens.stylex.ts';
|
|
3
|
+
export declare const selectionStyles: Readonly<{
|
|
4
|
+
readonly trigger: Readonly<{
|
|
5
|
+
readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
|
|
6
|
+
readonly boxSizing: stylex.StyleXClassNameFor<"boxSizing", "border-box">;
|
|
7
|
+
readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
|
|
8
|
+
readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "space-between">;
|
|
9
|
+
readonly gap: stylex.StyleXClassNameFor<"gap", string>;
|
|
10
|
+
readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
|
|
11
|
+
readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", 0>;
|
|
12
|
+
readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", string>;
|
|
13
|
+
readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
|
|
14
|
+
readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 1>;
|
|
15
|
+
readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
|
|
16
|
+
readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
|
|
17
|
+
readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
|
|
18
|
+
readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
|
|
19
|
+
readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
|
|
20
|
+
readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
|
|
21
|
+
readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "left">;
|
|
22
|
+
readonly color: stylex.StyleXClassNameFor<"color", string>;
|
|
23
|
+
readonly cursor: stylex.StyleXClassNameFor<"cursor", "pointer">;
|
|
24
|
+
readonly ':hover:not([data-disabled])': stylex.StyleXClassNameFor<":hover:not([data-disabled])", {
|
|
25
|
+
readonly backgroundColor: {
|
|
26
|
+
readonly [conditions.hoverPointer]: stylex.StyleXVar<string>;
|
|
27
|
+
};
|
|
28
|
+
}>;
|
|
29
|
+
readonly ':is([data-disabled])': stylex.StyleXClassNameFor<":is([data-disabled])", {
|
|
30
|
+
readonly opacity: stylex.StyleXVar<string>;
|
|
31
|
+
readonly cursor: "default";
|
|
32
|
+
}>;
|
|
33
|
+
readonly ':is([data-invalid])': stylex.StyleXClassNameFor<":is([data-invalid])", {
|
|
34
|
+
readonly borderColor: stylex.StyleXVar<string>;
|
|
35
|
+
}>;
|
|
36
|
+
readonly ':focus-visible': stylex.StyleXClassNameFor<":focus-visible", {
|
|
37
|
+
readonly outlineWidth: stylex.StyleXVar<string>;
|
|
38
|
+
readonly outlineStyle: "solid";
|
|
39
|
+
readonly outlineColor: stylex.StyleXVar<string>;
|
|
40
|
+
readonly outlineOffset: `calc(0px - ${stylex.StyleXVar<string>})`;
|
|
41
|
+
}>;
|
|
42
|
+
}>;
|
|
43
|
+
readonly outlined: Readonly<{
|
|
44
|
+
readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
|
|
45
|
+
readonly borderColor: stylex.StyleXClassNameFor<"borderColor", string>;
|
|
46
|
+
}>;
|
|
47
|
+
readonly ghost: Readonly<{
|
|
48
|
+
readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "transparent">;
|
|
49
|
+
readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "transparent">;
|
|
50
|
+
readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 0>;
|
|
51
|
+
}>;
|
|
52
|
+
readonly value: Readonly<{
|
|
53
|
+
readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
|
|
54
|
+
readonly flex: stylex.StyleXClassNameFor<"flex", 1>;
|
|
55
|
+
readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
|
|
56
|
+
readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
|
|
57
|
+
readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
|
|
58
|
+
}>;
|
|
59
|
+
readonly icon: Readonly<{
|
|
60
|
+
readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
|
|
61
|
+
readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
|
|
62
|
+
readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
|
|
63
|
+
}>;
|
|
64
|
+
readonly positioner: Readonly<{
|
|
65
|
+
readonly zIndex: stylex.StyleXClassNameFor<"zIndex", string>;
|
|
66
|
+
readonly minWidth: stylex.StyleXClassNameFor<"minWidth", "var(--anchor-width)">;
|
|
67
|
+
readonly maxWidth: stylex.StyleXClassNameFor<"maxWidth", "calc(100vw - 16px)">;
|
|
68
|
+
}>;
|
|
69
|
+
readonly popup: Readonly<{
|
|
70
|
+
readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 1>;
|
|
71
|
+
readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
|
|
72
|
+
readonly borderColor: stylex.StyleXClassNameFor<"borderColor", string>;
|
|
73
|
+
readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
|
|
74
|
+
readonly padding: stylex.StyleXClassNameFor<"padding", string>;
|
|
75
|
+
readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
|
|
76
|
+
readonly color: stylex.StyleXClassNameFor<"color", string>;
|
|
77
|
+
readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
|
|
78
|
+
readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
|
|
79
|
+
readonly boxShadow: stylex.StyleXClassNameFor<"boxShadow", string>;
|
|
80
|
+
readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "var(--available-height)">;
|
|
81
|
+
readonly overflowY: stylex.StyleXClassNameFor<"overflowY", "auto">;
|
|
82
|
+
readonly overscrollBehavior: stylex.StyleXClassNameFor<"overscrollBehavior", "contain">;
|
|
83
|
+
}>;
|
|
84
|
+
readonly option: Readonly<{
|
|
85
|
+
readonly display: stylex.StyleXClassNameFor<"display", "flex">;
|
|
86
|
+
readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
|
|
87
|
+
readonly gap: stylex.StyleXClassNameFor<"gap", string>;
|
|
88
|
+
readonly minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
|
|
89
|
+
readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", string>;
|
|
90
|
+
readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
|
|
91
|
+
readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
|
|
92
|
+
readonly WebkitFontSmoothing: stylex.StyleXClassNameFor<"WebkitFontSmoothing", "antialiased">;
|
|
93
|
+
readonly fontSize: stylex.StyleXClassNameFor<"fontSize", string>;
|
|
94
|
+
readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", string>;
|
|
95
|
+
readonly cursor: stylex.StyleXClassNameFor<"cursor", "pointer">;
|
|
96
|
+
readonly outlineWidth: stylex.StyleXClassNameFor<"outlineWidth", 0>;
|
|
97
|
+
readonly ':is([data-highlighted])': stylex.StyleXClassNameFor<":is([data-highlighted])", {
|
|
98
|
+
readonly backgroundColor: stylex.StyleXVar<string>;
|
|
99
|
+
}>;
|
|
100
|
+
readonly ':is([data-disabled])': stylex.StyleXClassNameFor<":is([data-disabled])", {
|
|
101
|
+
readonly color: stylex.StyleXVar<string>;
|
|
102
|
+
readonly cursor: "default";
|
|
103
|
+
}>;
|
|
104
|
+
}>;
|
|
105
|
+
readonly optionText: Readonly<{
|
|
106
|
+
readonly flex: stylex.StyleXClassNameFor<"flex", 1>;
|
|
107
|
+
readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
|
|
108
|
+
readonly overflowWrap: stylex.StyleXClassNameFor<"overflowWrap", "anywhere">;
|
|
109
|
+
}>;
|
|
110
|
+
}>;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';
|
|
2
|
+
import { Radio as BaseRadio } from '@base-ui/react/radio';
|
|
3
|
+
import { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';
|
|
4
|
+
import { Switch as BaseSwitch } from '@base-ui/react/switch';
|
|
5
|
+
import { Toggle as BaseToggle } from '@base-ui/react/toggle';
|
|
6
|
+
import { ToggleGroup as BaseToggleGroup } from '@base-ui/react/toggle-group';
|
|
7
|
+
import type { ComponentProps, ReactNode } from 'react';
|
|
8
|
+
import type { CheckedStateProperties, ReadOnlyValueProperties, ValueStateProperties } from './control-state.ts';
|
|
9
|
+
import type { PlacementStyle } from './style-composition.ts';
|
|
10
|
+
type CheckboxRootProps = Omit<ComponentProps<typeof BaseCheckbox.Root>, 'checked' | 'defaultChecked' | 'onCheckedChange' | 'readOnly'> & CheckedStateProperties<NonNullable<BaseCheckbox.Root.Props['onCheckedChange']>> & {
|
|
11
|
+
readonly xstyle?: PlacementStyle;
|
|
12
|
+
};
|
|
13
|
+
type CheckboxIndicatorProps = ComponentProps<typeof BaseCheckbox.Indicator>;
|
|
14
|
+
type RadioGroupRootProps<Value> = Omit<BaseRadioGroup.Props<Value>, 'value' | 'defaultValue' | 'onValueChange'> & (ValueStateProperties<Value, NonNullable<BaseRadioGroup.Props<Value>['onValueChange']>> | ReadOnlyValueProperties<Value, NonNullable<BaseRadioGroup.Props<Value>['onValueChange']>>) & {
|
|
15
|
+
readonly xstyle?: PlacementStyle;
|
|
16
|
+
};
|
|
17
|
+
type RadioItemProps<Value> = BaseRadio.Root.Props<Value> & {
|
|
18
|
+
readonly xstyle?: PlacementStyle;
|
|
19
|
+
};
|
|
20
|
+
type RadioIndicatorProps = ComponentProps<typeof BaseRadio.Indicator>;
|
|
21
|
+
type SwitchRootProps = Omit<ComponentProps<typeof BaseSwitch.Root>, 'checked' | 'defaultChecked' | 'onCheckedChange' | 'readOnly'> & CheckedStateProperties<NonNullable<BaseSwitch.Root.Props['onCheckedChange']>> & {
|
|
22
|
+
readonly xstyle?: PlacementStyle;
|
|
23
|
+
};
|
|
24
|
+
type SwitchThumbProps = ComponentProps<typeof BaseSwitch.Thumb>;
|
|
25
|
+
type ToggleGroupRootProps<Value extends string> = Omit<BaseToggleGroup.Props<Value>, 'value' | 'defaultValue' | 'onValueChange'> & ValueStateProperties<ReadonlyArray<Value>, NonNullable<BaseToggleGroup.Props<Value>['onValueChange']>> & {
|
|
26
|
+
readonly xstyle?: PlacementStyle;
|
|
27
|
+
};
|
|
28
|
+
type ToggleItemProps<Value extends string> = Omit<BaseToggle.Props<Value>, 'value' | 'pressed' | 'defaultPressed' | 'onPressedChange'> & {
|
|
29
|
+
readonly value: Value;
|
|
30
|
+
};
|
|
31
|
+
declare function CheckboxRoot({ className, style, xstyle, ...props }: CheckboxRootProps): ReactNode;
|
|
32
|
+
declare function CheckboxIndicator({ children, className, style, ...props }: CheckboxIndicatorProps): ReactNode;
|
|
33
|
+
declare function RadioGroupRoot<Value>({ className, style, xstyle, ...props }: RadioGroupRootProps<Value>): ReactNode;
|
|
34
|
+
declare function RadioItem<Value>({ className, style, xstyle, ...props }: RadioItemProps<Value>): ReactNode;
|
|
35
|
+
declare function RadioIndicator({ className, style, ...props }: RadioIndicatorProps): ReactNode;
|
|
36
|
+
declare function SwitchRoot({ className, style, xstyle, ...props }: SwitchRootProps): ReactNode;
|
|
37
|
+
declare function SwitchThumb({ className, style, ...props }: SwitchThumbProps): ReactNode;
|
|
38
|
+
declare function ToggleGroupRoot<Value extends string>({ className, style, xstyle, ...props }: ToggleGroupRootProps<Value>): ReactNode;
|
|
39
|
+
declare function ToggleItem<Value extends string>({ className, style, ...props }: ToggleItemProps<Value>): ReactNode;
|
|
40
|
+
export declare const Checkbox: {
|
|
41
|
+
Root: typeof CheckboxRoot;
|
|
42
|
+
Indicator: typeof CheckboxIndicator;
|
|
43
|
+
};
|
|
44
|
+
export declare const RadioGroup: {
|
|
45
|
+
Root: typeof RadioGroupRoot;
|
|
46
|
+
Item: typeof RadioItem;
|
|
47
|
+
Indicator: typeof RadioIndicator;
|
|
48
|
+
};
|
|
49
|
+
export declare const Switch: {
|
|
50
|
+
Root: typeof SwitchRoot;
|
|
51
|
+
Thumb: typeof SwitchThumb;
|
|
52
|
+
};
|
|
53
|
+
export declare const ToggleGroup: {
|
|
54
|
+
Root: typeof ToggleGroupRoot;
|
|
55
|
+
Item: typeof ToggleItem;
|
|
56
|
+
};
|
|
57
|
+
export {};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
type SkeletonShape = 'rectangle' | 'circle';
|
|
3
|
+
export type SkeletonProps = {
|
|
4
|
+
readonly width?: number | `${number}%`;
|
|
5
|
+
readonly height?: number;
|
|
6
|
+
readonly shape?: SkeletonShape;
|
|
7
|
+
};
|
|
8
|
+
export type SkeletonTextProps = {
|
|
9
|
+
readonly lines?: number;
|
|
10
|
+
};
|
|
11
|
+
export type SpinnerProps = {
|
|
12
|
+
readonly label: string;
|
|
13
|
+
readonly showLabel?: boolean;
|
|
14
|
+
};
|
|
15
|
+
export declare function Skeleton({ width, height, shape }: SkeletonProps): ReactNode;
|
|
16
|
+
export declare function SkeletonText({ lines }: SkeletonTextProps): ReactNode;
|
|
17
|
+
export declare function Spinner({ label, showLabel }: SpinnerProps): ReactNode;
|
|
18
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export declare const themeProps: {
|
|
2
|
+
readonly light: Readonly<{
|
|
3
|
+
className?: string;
|
|
4
|
+
'data-style-src'?: string;
|
|
5
|
+
style?: Readonly<{
|
|
6
|
+
[$$Key$$: string]: string | number;
|
|
7
|
+
}>;
|
|
8
|
+
}>;
|
|
9
|
+
readonly dark: Readonly<{
|
|
10
|
+
className?: string;
|
|
11
|
+
'data-style-src'?: string;
|
|
12
|
+
style?: Readonly<{
|
|
13
|
+
[$$Key$$: string]: string | number;
|
|
14
|
+
}>;
|
|
15
|
+
}>;
|
|
16
|
+
};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { Toast as BaseToast } from '@base-ui/react/toast';
|
|
2
|
+
import type { ComponentProps, ReactNode } from 'react';
|
|
3
|
+
type ToastViewportProps = ComponentProps<typeof BaseToast.Viewport>;
|
|
4
|
+
type ToastRootProps = ComponentProps<typeof BaseToast.Root>;
|
|
5
|
+
type ToastContentProps = ComponentProps<typeof BaseToast.Content>;
|
|
6
|
+
type ToastTitleProps = ComponentProps<typeof BaseToast.Title>;
|
|
7
|
+
type ToastDescriptionProps = ComponentProps<typeof BaseToast.Description>;
|
|
8
|
+
type ToastCloseProps = ComponentProps<typeof BaseToast.Close>;
|
|
9
|
+
declare function ToastViewport({ className, style, ...props }: ToastViewportProps): ReactNode;
|
|
10
|
+
declare function ToastRoot({ className, style, ...props }: ToastRootProps): ReactNode;
|
|
11
|
+
declare function ToastContent({ className, style, ...props }: ToastContentProps): ReactNode;
|
|
12
|
+
declare function ToastTitle({ className, style, ...props }: ToastTitleProps): ReactNode;
|
|
13
|
+
declare function ToastDescription({ className, style, ...props }: ToastDescriptionProps): ReactNode;
|
|
14
|
+
declare function ToastClose(props: ToastCloseProps): ReactNode;
|
|
15
|
+
export declare const Toast: {
|
|
16
|
+
Provider: import("react").FC<import("@base-ui/react").ToastProviderProps>;
|
|
17
|
+
Portal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ToastPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
18
|
+
Viewport: typeof ToastViewport;
|
|
19
|
+
Root: typeof ToastRoot;
|
|
20
|
+
Content: typeof ToastContent;
|
|
21
|
+
Title: typeof ToastTitle;
|
|
22
|
+
Description: typeof ToastDescription;
|
|
23
|
+
Close: typeof ToastClose;
|
|
24
|
+
Action: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ToastActionProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
25
|
+
useManager: typeof BaseToast.useToastManager;
|
|
26
|
+
createManager: typeof BaseToast.createToastManager;
|
|
27
|
+
};
|
|
28
|
+
export {};
|
|
@@ -18,6 +18,61 @@ export declare const colors: stylex.VarGroup<Readonly<{
|
|
|
18
18
|
dangerSoft: string;
|
|
19
19
|
overlay: string;
|
|
20
20
|
}>, symbol>;
|
|
21
|
+
export declare const darkColors: {
|
|
22
|
+
canvas: string;
|
|
23
|
+
surface: string;
|
|
24
|
+
ink: string;
|
|
25
|
+
inkHover: string;
|
|
26
|
+
inverse: string;
|
|
27
|
+
muted: string;
|
|
28
|
+
faint: string;
|
|
29
|
+
line: string;
|
|
30
|
+
focus: string;
|
|
31
|
+
accent: string;
|
|
32
|
+
accentSoft: string;
|
|
33
|
+
warning: string;
|
|
34
|
+
warningSoft: string;
|
|
35
|
+
danger: string;
|
|
36
|
+
dangerHover: string;
|
|
37
|
+
dangerSoft: string;
|
|
38
|
+
overlay: string;
|
|
39
|
+
};
|
|
40
|
+
export declare const chartColors: stylex.VarGroup<Readonly<{
|
|
41
|
+
series1: string;
|
|
42
|
+
series2: string;
|
|
43
|
+
series3: string;
|
|
44
|
+
series4: string;
|
|
45
|
+
series5: string;
|
|
46
|
+
series6: string;
|
|
47
|
+
negative: string;
|
|
48
|
+
positive: string;
|
|
49
|
+
missing: string;
|
|
50
|
+
}>, symbol>;
|
|
51
|
+
export declare const darkChartColors: {
|
|
52
|
+
series1: string;
|
|
53
|
+
series2: string;
|
|
54
|
+
series3: string;
|
|
55
|
+
series4: string;
|
|
56
|
+
series5: string;
|
|
57
|
+
series6: string;
|
|
58
|
+
negative: string;
|
|
59
|
+
positive: string;
|
|
60
|
+
missing: string;
|
|
61
|
+
};
|
|
62
|
+
export declare const syntaxColors: stylex.VarGroup<Readonly<{
|
|
63
|
+
keyword: string;
|
|
64
|
+
string: string;
|
|
65
|
+
comment: string;
|
|
66
|
+
number: string;
|
|
67
|
+
type: string;
|
|
68
|
+
}>, symbol>;
|
|
69
|
+
export declare const darkSyntaxColors: {
|
|
70
|
+
keyword: string;
|
|
71
|
+
string: string;
|
|
72
|
+
comment: string;
|
|
73
|
+
number: string;
|
|
74
|
+
type: string;
|
|
75
|
+
};
|
|
21
76
|
export declare const spacing: stylex.VarGroup<Readonly<{
|
|
22
77
|
xxs: string;
|
|
23
78
|
xs: string;
|
|
@@ -32,6 +87,7 @@ export declare const typography: stylex.VarGroup<Readonly<{
|
|
|
32
87
|
monoFamily: string;
|
|
33
88
|
bodySize: string;
|
|
34
89
|
bodyLineHeight: string;
|
|
90
|
+
multilineLineHeight: string;
|
|
35
91
|
captionSize: string;
|
|
36
92
|
captionLineHeight: string;
|
|
37
93
|
inputSize: string;
|
|
@@ -50,6 +106,7 @@ export declare const controls: stylex.VarGroup<Readonly<{
|
|
|
50
106
|
coarseTarget: string;
|
|
51
107
|
iconSize: string;
|
|
52
108
|
paddingInline: string;
|
|
109
|
+
paddingBlock: string;
|
|
53
110
|
gap: string;
|
|
54
111
|
focusWidth: string;
|
|
55
112
|
disabledOpacity: string;
|
|
@@ -67,6 +124,9 @@ export declare const motion: stylex.VarGroup<Readonly<{
|
|
|
67
124
|
export declare const shadows: stylex.VarGroup<Readonly<{
|
|
68
125
|
popup: string;
|
|
69
126
|
}>, symbol>;
|
|
127
|
+
export declare const darkShadows: {
|
|
128
|
+
popup: string;
|
|
129
|
+
};
|
|
70
130
|
export declare const layers: {
|
|
71
131
|
backdrop: string;
|
|
72
132
|
dialog: string;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
export type TraceStatus = 'pending' | 'running' | 'complete' | 'failed' | 'skipped' | 'unknown';
|
|
3
|
+
export type TraceRootProps = {
|
|
4
|
+
readonly label: string;
|
|
5
|
+
readonly children: ReactNode;
|
|
6
|
+
};
|
|
7
|
+
export type TraceGroupProps = {
|
|
8
|
+
readonly label: string;
|
|
9
|
+
readonly children: ReactNode;
|
|
10
|
+
};
|
|
11
|
+
type TraceSelection = {
|
|
12
|
+
readonly selected: boolean;
|
|
13
|
+
readonly onSelect: (id: string) => void;
|
|
14
|
+
} | {
|
|
15
|
+
readonly selected?: never;
|
|
16
|
+
readonly onSelect?: never;
|
|
17
|
+
};
|
|
18
|
+
export type TraceItemProps = TraceSelection & {
|
|
19
|
+
readonly id: string;
|
|
20
|
+
readonly label: string;
|
|
21
|
+
readonly status: TraceStatus;
|
|
22
|
+
readonly statusLabel: string;
|
|
23
|
+
readonly description?: string;
|
|
24
|
+
readonly detail?: ReactNode;
|
|
25
|
+
readonly children?: ReactNode;
|
|
26
|
+
};
|
|
27
|
+
declare function TraceRoot({ label, children }: TraceRootProps): ReactNode;
|
|
28
|
+
declare function TraceGroup({ label, children }: TraceGroupProps): ReactNode;
|
|
29
|
+
declare function TraceItem({ id, label, status, statusLabel, description, detail, selected, onSelect, children, }: TraceItemProps): ReactNode;
|
|
30
|
+
export declare const Trace: {
|
|
31
|
+
Root: typeof TraceRoot;
|
|
32
|
+
Item: typeof TraceItem;
|
|
33
|
+
Group: typeof TraceGroup;
|
|
34
|
+
};
|
|
35
|
+
export {};
|
|
@@ -2,3 +2,5 @@ export { AppShell } from './app-shell.tsx';
|
|
|
2
2
|
export { PageToolbar, ToolbarAction } from './page-toolbar.tsx';
|
|
3
3
|
export { DetailPage } from './detail-page.tsx';
|
|
4
4
|
export { Navigation, NavigationItem, NavigationLink, SidebarLabel, SidebarFooter } from './sidebar.tsx';
|
|
5
|
+
export { Resizable } from './resizable.tsx';
|
|
6
|
+
export type { ResizableRootProps, ResizablePaneProps, ResizableHandleProps } from './resizable.tsx';
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { ComponentProps, ReactNode } from 'react';
|
|
2
|
+
export type ResizableRootProps = {
|
|
3
|
+
readonly orientation?: 'horizontal' | 'vertical';
|
|
4
|
+
readonly initialSizes?: Readonly<Record<string, number>>;
|
|
5
|
+
readonly onSizesChange?: (sizes: Readonly<Record<string, number>>) => void;
|
|
6
|
+
readonly disabled?: boolean;
|
|
7
|
+
} & Omit<ComponentProps<'div'>, 'onChange' | 'defaultValue'>;
|
|
8
|
+
export type ResizablePaneProps = {
|
|
9
|
+
readonly id: string;
|
|
10
|
+
readonly initialSizePercent?: number;
|
|
11
|
+
readonly minimumSizePercent?: number;
|
|
12
|
+
readonly maximumSizePercent?: number;
|
|
13
|
+
readonly collapsible?: boolean;
|
|
14
|
+
} & Omit<ComponentProps<'div'>, 'id' | 'onResize'>;
|
|
15
|
+
export type ResizableHandleProps = {
|
|
16
|
+
readonly 'aria-label': string;
|
|
17
|
+
readonly 'disabled'?: boolean;
|
|
18
|
+
} & Omit<ComponentProps<'div'>, 'children'>;
|
|
19
|
+
declare function ResizableRoot({ orientation, initialSizes, onSizesChange, disabled, ref, ...props }: ResizableRootProps): ReactNode;
|
|
20
|
+
declare function ResizablePane({ id, initialSizePercent, minimumSizePercent, maximumSizePercent, collapsible, ref, ...props }: ResizablePaneProps): ReactNode;
|
|
21
|
+
declare function ResizableHandle({ ref, ...props }: ResizableHandleProps): ReactNode;
|
|
22
|
+
export declare const Resizable: {
|
|
23
|
+
Root: typeof ResizableRoot;
|
|
24
|
+
Pane: typeof ResizablePane;
|
|
25
|
+
Handle: typeof ResizableHandle;
|
|
26
|
+
};
|
|
27
|
+
export {};
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { n as e, t } from "./pierre-theme-CPlfl-AA.js";
|
|
2
|
+
import * as n from "@stylexjs/stylex";
|
|
3
|
+
import { useCallback as r, useState as i } from "react";
|
|
4
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
5
|
+
import { Virtualizer as o, parseDiffFromFile as s, parsePatchFiles as c, registerCustomTheme as l } from "@pierre/diffs";
|
|
6
|
+
import { FileDiff as u, VirtualizerContext as d } from "@pierre/diffs/react";
|
|
7
|
+
// packages/content/src/diff/pierre-diff.tsx
|
|
8
|
+
var f = {
|
|
9
|
+
kVQacm: "xysyzu8",
|
|
10
|
+
$$css: !0
|
|
11
|
+
}, p = { viewport: (e) => [
|
|
12
|
+
f,
|
|
13
|
+
{
|
|
14
|
+
kskxy: e == null ? e : "x1jols5v",
|
|
15
|
+
$$css: !0
|
|
16
|
+
},
|
|
17
|
+
{ "--x-maxHeight": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(e) }
|
|
18
|
+
] };
|
|
19
|
+
l("mechane", () => Promise.resolve(t), "zed");
|
|
20
|
+
function m(e) {
|
|
21
|
+
return e === null ? null : {
|
|
22
|
+
name: e.name,
|
|
23
|
+
contents: e.code,
|
|
24
|
+
lang: e.language ?? "text"
|
|
25
|
+
};
|
|
26
|
+
}
|
|
27
|
+
function h(e) {
|
|
28
|
+
return e.patch === void 0 ? [s(m(e.before), m(e.after), {}, !0)] : c(e.patch, { throwOnError: !0 }).flatMap((e) => e.files);
|
|
29
|
+
}
|
|
30
|
+
function g({ files: t, layout: s, wrap: c, annotations: l, maxHeight: f, label: m }) {
|
|
31
|
+
let [h] = i(() => new o()), g = r((e) => {
|
|
32
|
+
e === null ? h.cleanUp() : h.setup(e);
|
|
33
|
+
}, [h]);
|
|
34
|
+
return /* @__PURE__ */ a(d.Provider, {
|
|
35
|
+
value: h,
|
|
36
|
+
children: /* @__PURE__ */ a("div", {
|
|
37
|
+
ref: g,
|
|
38
|
+
role: "region",
|
|
39
|
+
"aria-label": `${m} changes`,
|
|
40
|
+
tabIndex: 0,
|
|
41
|
+
...n.props(p.viewport(f)),
|
|
42
|
+
children: /* @__PURE__ */ a("div", { children: t.map((t) => /* @__PURE__ */ a(u, {
|
|
43
|
+
fileDiff: t,
|
|
44
|
+
disableWorkerPool: !0,
|
|
45
|
+
options: {
|
|
46
|
+
preferredHighlighter: "highlights",
|
|
47
|
+
theme: "mechane",
|
|
48
|
+
themeType: "system",
|
|
49
|
+
unsafeCSS: e,
|
|
50
|
+
diffStyle: s,
|
|
51
|
+
overflow: c ? "wrap" : "scroll",
|
|
52
|
+
hunkSeparators: "line-info",
|
|
53
|
+
tokenizeMaxLength: 2e5,
|
|
54
|
+
tokenizeMaxLineLength: 4096
|
|
55
|
+
},
|
|
56
|
+
lineAnnotations: l.filter((e) => e.file === t.name).map((e) => ({
|
|
57
|
+
side: e.side === "old" ? "deletions" : "additions",
|
|
58
|
+
lineNumber: e.line,
|
|
59
|
+
metadata: e.content
|
|
60
|
+
})),
|
|
61
|
+
renderAnnotation: (e) => e.metadata
|
|
62
|
+
}, t.name)) })
|
|
63
|
+
})
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
export { g as PierreDiff, h as prepareDiff };
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
import { colors as e, controls as t, spacing as n, syntaxColors as r, typography as i } from "./tokens.js";
|
|
2
|
+
// packages/content/src/pierre-theme.ts
|
|
3
|
+
var a = {
|
|
4
|
+
name: "Mechane",
|
|
5
|
+
appearance: "light",
|
|
6
|
+
cssVariables: {
|
|
7
|
+
prefix: "--mechane-syntax-",
|
|
8
|
+
defaults: {
|
|
9
|
+
foreground: e.ink,
|
|
10
|
+
background: e.surface,
|
|
11
|
+
keyword: r.keyword,
|
|
12
|
+
string: r.string,
|
|
13
|
+
comment: r.comment,
|
|
14
|
+
number: r.number,
|
|
15
|
+
type: r.type,
|
|
16
|
+
punctuation: e.muted
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
style: {
|
|
20
|
+
"editor.background": "background",
|
|
21
|
+
"editor.foreground": "foreground",
|
|
22
|
+
syntax: {
|
|
23
|
+
keyword: {
|
|
24
|
+
color: "keyword",
|
|
25
|
+
font_weight: 600
|
|
26
|
+
},
|
|
27
|
+
string: "string",
|
|
28
|
+
comment: "comment",
|
|
29
|
+
number: "number",
|
|
30
|
+
type: "type",
|
|
31
|
+
function: "foreground",
|
|
32
|
+
operator: "punctuation",
|
|
33
|
+
punctuation: "punctuation"
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}, o = `
|
|
37
|
+
:host {
|
|
38
|
+
color-scheme: inherit;
|
|
39
|
+
--diffs-font-family: ${i.monoFamily};
|
|
40
|
+
--diffs-header-font-family: ${i.fontFamily};
|
|
41
|
+
--diffs-font-size: ${i.captionSize};
|
|
42
|
+
--diffs-line-height: ${i.bodyLineHeight};
|
|
43
|
+
--diffs-bg: ${e.surface};
|
|
44
|
+
--diffs-fg: ${e.ink};
|
|
45
|
+
--diffs-fg-number: ${e.muted};
|
|
46
|
+
--diffs-bg-addition: ${e.accentSoft};
|
|
47
|
+
--diffs-bg-deletion: ${e.dangerSoft};
|
|
48
|
+
--diffs-addition-color-override: ${e.accent};
|
|
49
|
+
--diffs-deletion-color-override: ${e.danger};
|
|
50
|
+
--diffs-modified-color-override: ${e.focus};
|
|
51
|
+
--diffs-bg-context-override: ${e.surface};
|
|
52
|
+
--diffs-bg-context-gutter-override: ${e.canvas};
|
|
53
|
+
--diffs-bg-separator-override: ${e.canvas};
|
|
54
|
+
--diffs-selection-background: ${e.accentSoft};
|
|
55
|
+
font-family: ${i.monoFamily};
|
|
56
|
+
font-size: ${i.captionSize};
|
|
57
|
+
color: ${e.ink};
|
|
58
|
+
background: ${e.surface};
|
|
59
|
+
}
|
|
60
|
+
pre { font-family: ${i.monoFamily}; font-size: ${i.captionSize}; line-height: ${i.bodyLineHeight}; }
|
|
61
|
+
[data-line-number] { color: ${e.muted}; }
|
|
62
|
+
[data-diffs-header] { min-height: ${t.mdHeight}; border-bottom: 1px solid ${e.line}; }
|
|
63
|
+
`, s = `
|
|
64
|
+
:host {
|
|
65
|
+
color-scheme: inherit;
|
|
66
|
+
color: ${e.ink};
|
|
67
|
+
background: ${e.surface};
|
|
68
|
+
font-family: ${i.fontFamily};
|
|
69
|
+
font-size: ${i.bodySize};
|
|
70
|
+
--trees-font-family-override: ${i.fontFamily};
|
|
71
|
+
--trees-font-size-override: ${i.bodySize};
|
|
72
|
+
--trees-bg-override: ${e.surface};
|
|
73
|
+
--trees-fg-override: ${e.ink};
|
|
74
|
+
--trees-fg-muted-override: ${e.muted};
|
|
75
|
+
--trees-bg-muted-override: ${e.canvas};
|
|
76
|
+
--trees-input-bg-override: ${e.surface};
|
|
77
|
+
--trees-border-color-override: ${e.line};
|
|
78
|
+
--trees-border-radius-override: 0px;
|
|
79
|
+
--trees-accent-override: ${e.focus};
|
|
80
|
+
--trees-focus-ring-color-override: ${e.focus};
|
|
81
|
+
--trees-focus-ring-width-override: ${t.focusWidth};
|
|
82
|
+
--trees-selected-fg-override: ${e.ink};
|
|
83
|
+
--trees-selected-bg-override: ${e.canvas};
|
|
84
|
+
--trees-selected-focused-border-color-override: ${e.focus};
|
|
85
|
+
--trees-status-added-override: ${e.accent};
|
|
86
|
+
--trees-status-deleted-override: ${e.danger};
|
|
87
|
+
--trees-status-ignored-override: ${e.muted};
|
|
88
|
+
--trees-status-modified-override: ${e.warning};
|
|
89
|
+
--trees-status-renamed-override: ${e.warning};
|
|
90
|
+
--trees-status-untracked-override: ${e.accent};
|
|
91
|
+
}
|
|
92
|
+
[role="treeitem"] { border-radius: 0; padding-inline: ${n.sm}; }
|
|
93
|
+
[role="treeitem"][aria-selected="true"] { background: ${e.canvas}; color: ${e.ink}; }
|
|
94
|
+
[role="treeitem"]:focus-visible { outline: ${t.focusWidth} solid ${e.focus}; outline-offset: -2px; }
|
|
95
|
+
`;
|
|
96
|
+
export { o as n, s as r, a as t };
|