@aggc/ui 0.4.0 → 0.4.1
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/chunks/UiSkeleton.vue_vue_type_script_setup_true_lang-Lghyrtms.js +1201 -0
- package/dist/chunks/pageHeader-CcJrPX_8.js +522 -0
- package/dist/components/PageSurface.styles.d.ts +1 -0
- package/dist/components/PageSurface.vue.d.ts +13 -0
- package/dist/components/ResultPanel.styles.d.ts +64 -0
- package/dist/components/ResultPanel.vue.d.ts +16 -0
- package/dist/components/SectionCard.styles.d.ts +13 -0
- package/dist/components/SectionCard.vue.d.ts +27 -0
- package/dist/components/StatusBadge.styles.d.ts +24 -0
- package/dist/components/StatusBadge.vue.d.ts +18 -0
- package/dist/components/UiButton.styles.d.ts +54 -0
- package/dist/components/UiButton.vue.d.ts +28 -0
- package/dist/components/UiCheckbox.styles.d.ts +42 -0
- package/dist/components/UiCheckbox.vue.d.ts +37 -0
- package/dist/components/UiField.styles.d.ts +7 -0
- package/dist/components/UiField.vue.d.ts +22 -0
- package/dist/components/UiLoadingState.styles.d.ts +4 -0
- package/dist/components/UiLoadingState.vue.d.ts +10 -0
- package/dist/components/UiSegmentedControl.styles.d.ts +23 -0
- package/dist/components/UiSegmentedControl.vue.d.ts +14 -0
- package/dist/components/UiSelect.styles.d.ts +104 -0
- package/dist/components/UiSelect.vue.d.ts +35 -0
- package/dist/components/UiSkeleton.styles.d.ts +67 -0
- package/dist/components/UiSkeleton.vue.d.ts +12 -0
- package/dist/components/index.d.ts +11 -0
- package/dist/components.d.ts +1 -0
- package/dist/components.js +14 -0
- package/dist/css.d.ts +2 -0
- package/dist/css.js +1 -0
- package/dist/fonts.css +6 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +65 -0
- package/dist/styles/index.d.ts +20 -0
- package/dist/styles/layouts/cluster.d.ts +27 -0
- package/dist/styles/layouts/page.d.ts +2 -0
- package/dist/styles/layouts/split.d.ts +22 -0
- package/dist/styles/layouts/stack.d.ts +19 -0
- package/dist/styles/patterns/actionToolbar.d.ts +1 -0
- package/dist/styles/patterns/emptyState.d.ts +2 -0
- package/dist/styles/patterns/infoPanel.d.ts +2 -0
- package/dist/styles/patterns/metricGrid.d.ts +22 -0
- package/dist/styles/patterns/pageHeader.d.ts +3 -0
- package/dist/styles/patterns/resultRegion.d.ts +1 -0
- package/dist/styles/patterns/selectableListDetail.d.ts +3 -0
- package/dist/styles/primitives/feedback.d.ts +4 -0
- package/dist/styles/primitives/fields.d.ts +3 -0
- package/dist/styles/primitives/surfaces.d.ts +3 -0
- package/dist/styles/primitives/typography.d.ts +6 -0
- package/dist/styles/recipes/badge.recipe.d.ts +32 -0
- package/dist/styles/recipes/button.recipe.d.ts +51 -0
- package/dist/styles/recipes/card.recipe.d.ts +59 -0
- package/dist/styles/recipes/dropdown.recipe.d.ts +25 -0
- package/dist/styles/recipes/input.recipe.d.ts +32 -0
- package/dist/styles.d.ts +1 -0
- package/dist/styles.js +429 -0
- package/dist/tokens/colors.d.ts +360 -0
- package/dist/tokens/core-colors.d.ts +238 -0
- package/dist/tokens/desktop-colors.d.ts +132 -0
- package/dist/tokens/index.d.ts +7 -0
- package/dist/tokens/motion.d.ts +10 -0
- package/dist/tokens/radius.d.ts +5 -0
- package/dist/tokens/spacing.d.ts +8 -0
- package/dist/tokens/typography.d.ts +10 -0
- package/dist/tokens-core.d.ts +5 -0
- package/dist/tokens-core.js +69 -0
- package/dist/tokens-desktop.d.ts +1 -0
- package/dist/tokens-desktop.js +30 -0
- package/dist/tokens.d.ts +1 -0
- package/dist/tokens.js +16 -0
- package/dist/ui.css +2026 -0
- package/package.json +1 -1
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export declare const clusterLayout: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
gap: {
|
|
3
|
+
xs: {
|
|
4
|
+
gap: "1";
|
|
5
|
+
};
|
|
6
|
+
sm: {
|
|
7
|
+
gap: "2";
|
|
8
|
+
};
|
|
9
|
+
md: {
|
|
10
|
+
gap: "3";
|
|
11
|
+
};
|
|
12
|
+
lg: {
|
|
13
|
+
gap: "4";
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
justify: {
|
|
17
|
+
start: {
|
|
18
|
+
justifyContent: "flex-start";
|
|
19
|
+
};
|
|
20
|
+
between: {
|
|
21
|
+
justifyContent: "space-between";
|
|
22
|
+
};
|
|
23
|
+
end: {
|
|
24
|
+
justifyContent: "flex-end";
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
}>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export declare const splitLayout: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
ratio: {
|
|
3
|
+
equal: {
|
|
4
|
+
gridTemplateColumns: {
|
|
5
|
+
base: "1fr";
|
|
6
|
+
xl: "repeat(2, minmax(0, 1fr))";
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
sidebar: {
|
|
10
|
+
gridTemplateColumns: {
|
|
11
|
+
base: "1fr";
|
|
12
|
+
xl: "minmax(18rem, 0.9fr) minmax(0, 1.4fr)";
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
detail: {
|
|
16
|
+
gridTemplateColumns: {
|
|
17
|
+
base: "1fr";
|
|
18
|
+
xl: "minmax(18rem, 0.85fr) minmax(0, 1.45fr)";
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
}>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const stackLayout: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
gap: {
|
|
3
|
+
xs: {
|
|
4
|
+
gap: "1";
|
|
5
|
+
};
|
|
6
|
+
sm: {
|
|
7
|
+
gap: "2";
|
|
8
|
+
};
|
|
9
|
+
md: {
|
|
10
|
+
gap: "3";
|
|
11
|
+
};
|
|
12
|
+
lg: {
|
|
13
|
+
gap: "4";
|
|
14
|
+
};
|
|
15
|
+
xl: {
|
|
16
|
+
gap: "5";
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const actionToolbarClass: string;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export declare const metricGridPattern: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
columns: {
|
|
3
|
+
two: {
|
|
4
|
+
gridTemplateColumns: {
|
|
5
|
+
base: "1fr";
|
|
6
|
+
md: "repeat(2, minmax(0, 1fr))";
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
three: {
|
|
10
|
+
gridTemplateColumns: {
|
|
11
|
+
base: "1fr";
|
|
12
|
+
lg: "repeat(3, minmax(0, 1fr))";
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
four: {
|
|
16
|
+
gridTemplateColumns: {
|
|
17
|
+
base: "1fr";
|
|
18
|
+
lg: "repeat(4, minmax(0, 1fr))";
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const resultRegionClass: string;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const eyebrowClass: string;
|
|
2
|
+
export declare const sectionTitleClass: string;
|
|
3
|
+
export declare const sectionDescriptionClass: string;
|
|
4
|
+
export declare const helperTextClass: string;
|
|
5
|
+
export declare const metricValueClass: string;
|
|
6
|
+
export declare const codeBlockClass: string;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
export declare const badgeRecipe: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
tone: {
|
|
3
|
+
neutral: {
|
|
4
|
+
borderColor: "badge.neutralBorder";
|
|
5
|
+
bg: "badge.neutralBg";
|
|
6
|
+
color: "badge.neutralText";
|
|
7
|
+
};
|
|
8
|
+
info: {
|
|
9
|
+
borderColor: "badge.infoBorder";
|
|
10
|
+
bg: "badge.infoBg";
|
|
11
|
+
color: "badge.infoText";
|
|
12
|
+
};
|
|
13
|
+
success: {
|
|
14
|
+
borderColor: "badge.successBorder";
|
|
15
|
+
bg: "badge.successBg";
|
|
16
|
+
color: "badge.successText";
|
|
17
|
+
};
|
|
18
|
+
warning: {
|
|
19
|
+
borderColor: "badge.warningBorder";
|
|
20
|
+
bg: "badge.warningBg";
|
|
21
|
+
color: "badge.warningText";
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
size: {
|
|
25
|
+
sm: {
|
|
26
|
+
px: "2.5";
|
|
27
|
+
py: "1.5";
|
|
28
|
+
fontSize: "xs";
|
|
29
|
+
};
|
|
30
|
+
md: {};
|
|
31
|
+
};
|
|
32
|
+
}>;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
export declare const buttonRecipe: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
variant: {
|
|
3
|
+
solid: {
|
|
4
|
+
bg: "linear-gradient(135deg, rgba(31,67,182,0.96) 0%, rgba(49,94,255,0.92) 100%)";
|
|
5
|
+
color: "text.inverse";
|
|
6
|
+
borderWidth: "1px";
|
|
7
|
+
borderColor: "rgba(255,255,255,0.18)";
|
|
8
|
+
boxShadow: "0 22px 36px -24px rgba(49,94,255,0.78), inset 0 1px 0 rgba(255,255,255,0.24)";
|
|
9
|
+
_dark: {
|
|
10
|
+
color: "#f7f9fd";
|
|
11
|
+
borderColor: "rgba(255,255,255,0.06)";
|
|
12
|
+
boxShadow: "0 22px 40px -24px rgba(71,121,255,0.55), inset 0 1px 0 rgba(255,255,255,0.18)";
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
outline: {
|
|
16
|
+
bg: "bg.buttonOutline";
|
|
17
|
+
color: "text.secondary";
|
|
18
|
+
borderWidth: "1px";
|
|
19
|
+
borderColor: "border.default";
|
|
20
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.18)";
|
|
21
|
+
_dark: {
|
|
22
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.04)";
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
subtle: {
|
|
26
|
+
bg: "bg.accentSoft";
|
|
27
|
+
color: "text.accent";
|
|
28
|
+
borderWidth: "1px";
|
|
29
|
+
borderColor: "badge.infoBorder";
|
|
30
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.22)";
|
|
31
|
+
_dark: {
|
|
32
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.04)";
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
disabled: {
|
|
37
|
+
true: {
|
|
38
|
+
cursor: "not-allowed";
|
|
39
|
+
opacity: number;
|
|
40
|
+
};
|
|
41
|
+
false: {
|
|
42
|
+
cursor: "pointer";
|
|
43
|
+
};
|
|
44
|
+
};
|
|
45
|
+
loading: {
|
|
46
|
+
true: {
|
|
47
|
+
cursor: "not-allowed";
|
|
48
|
+
opacity: number;
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
}>;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
export declare const cardRecipe: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
variant: {
|
|
3
|
+
surface: {
|
|
4
|
+
position: "relative";
|
|
5
|
+
overflow: "hidden";
|
|
6
|
+
borderRadius: "3xl";
|
|
7
|
+
borderColor: "border.subtle";
|
|
8
|
+
bg: "bg.card";
|
|
9
|
+
backdropFilter: "blur(28px) saturate(155%)";
|
|
10
|
+
boxShadow: "0 25px 30px -35px rgba(15,23,42,0.42)";
|
|
11
|
+
};
|
|
12
|
+
inset: {
|
|
13
|
+
borderRadius: "2xl";
|
|
14
|
+
borderColor: "border.soft";
|
|
15
|
+
bg: "bg.cardAlt";
|
|
16
|
+
backdropFilter: "blur(24px) saturate(145%)";
|
|
17
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.22)";
|
|
18
|
+
};
|
|
19
|
+
elevated: {
|
|
20
|
+
borderRadius: "2xl";
|
|
21
|
+
borderColor: "border.default";
|
|
22
|
+
bg: "bg.cardStrong";
|
|
23
|
+
backdropFilter: "blur(24px) saturate(145%)";
|
|
24
|
+
boxShadow: "0 16px 32px -28px rgba(15,23,42,0.42)";
|
|
25
|
+
};
|
|
26
|
+
selectable: {
|
|
27
|
+
borderRadius: "2xl";
|
|
28
|
+
borderColor: "border.default";
|
|
29
|
+
bg: "bg.cardAlt";
|
|
30
|
+
cursor: "pointer";
|
|
31
|
+
_hover: {
|
|
32
|
+
borderColor: "border.strong";
|
|
33
|
+
bg: "bg.card";
|
|
34
|
+
transform: "translateY(-1px)";
|
|
35
|
+
};
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
padding: {
|
|
39
|
+
none: {};
|
|
40
|
+
sm: {
|
|
41
|
+
p: "3";
|
|
42
|
+
};
|
|
43
|
+
md: {
|
|
44
|
+
p: "4";
|
|
45
|
+
};
|
|
46
|
+
lg: {
|
|
47
|
+
p: "5";
|
|
48
|
+
};
|
|
49
|
+
xl: {
|
|
50
|
+
p: "6";
|
|
51
|
+
};
|
|
52
|
+
};
|
|
53
|
+
selected: {
|
|
54
|
+
true: {
|
|
55
|
+
borderColor: "border.accent";
|
|
56
|
+
bg: "bg.cardStrong";
|
|
57
|
+
};
|
|
58
|
+
};
|
|
59
|
+
}>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export declare const dropdownRecipe: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
placement: {
|
|
3
|
+
anchored: {
|
|
4
|
+
position: "absolute";
|
|
5
|
+
top: "calc(100% + 10px)";
|
|
6
|
+
left: "0";
|
|
7
|
+
right: "0";
|
|
8
|
+
};
|
|
9
|
+
floating: {
|
|
10
|
+
position: "fixed";
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
density: {
|
|
14
|
+
cozy: {
|
|
15
|
+
borderRadius: "2xl";
|
|
16
|
+
p: "2";
|
|
17
|
+
gap: "1";
|
|
18
|
+
};
|
|
19
|
+
compact: {
|
|
20
|
+
borderRadius: "xl";
|
|
21
|
+
p: "1.5";
|
|
22
|
+
gap: "0.5";
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
}>;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
export declare const inputRecipe: import("../../../styled-system/types").RecipeRuntimeFn<{
|
|
2
|
+
size: {
|
|
3
|
+
sm: {
|
|
4
|
+
minHeight: "40px";
|
|
5
|
+
borderRadius: "lg";
|
|
6
|
+
px: "3";
|
|
7
|
+
py: "2.5";
|
|
8
|
+
lineHeight: "1.45";
|
|
9
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.2)";
|
|
10
|
+
};
|
|
11
|
+
md: {
|
|
12
|
+
minHeight: "48px";
|
|
13
|
+
borderRadius: "xl";
|
|
14
|
+
px: "4";
|
|
15
|
+
py: "3";
|
|
16
|
+
lineHeight: "1.5";
|
|
17
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.24), 0 14px 28px -28px rgba(15,23,42,0.42)";
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
kind: {
|
|
21
|
+
input: {};
|
|
22
|
+
textarea: {
|
|
23
|
+
minHeight: "420px";
|
|
24
|
+
borderRadius: "2xl";
|
|
25
|
+
px: "4";
|
|
26
|
+
py: "4";
|
|
27
|
+
lineHeight: "1.6";
|
|
28
|
+
fontFamily: "mono";
|
|
29
|
+
boxShadow: "inset 0 1px 0 rgba(255,255,255,0.24), 0 18px 36px -32px rgba(15,23,42,0.42)";
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
}>;
|
package/dist/styles.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./styles/index";
|