@rarui/styles 3.3.0 → 3.4.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/CHANGELOG.md +16 -0
- package/dist/index.css +2 -2
- package/dist/index.d.ts +1 -1
- package/dist/packages/exhibition/text/index.d.ts +4 -4
- package/dist/packages/feedback/status/index.d.ts +17 -0
- package/dist/packages/feedback/status/index.js +1 -1
- package/dist/packages/feedback/status/rarui-status.css +20 -0
- package/dist/packages/feedback/status/rarui-status.css.js +1 -1
- package/dist/packages/feedback/status/rarui-status.types.d.ts +4 -1
- package/dist/packages/input/checkbox/rarui-checkbox.css +8 -4
- package/dist/packages/input/radioButton/index.d.ts +4 -0
- package/dist/packages/input/radioButton/rarui-radioButton.css +4 -0
- package/dist/packages/input/radioButton/rarui-radioButton.css.d.ts +4 -0
- package/dist/packages/layout/box/index.d.ts +590 -590
- package/dist/packages/surface/card/index.d.ts +2 -2
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -53,7 +53,7 @@ export { LinkVariants } from './packages/navigation/link/rarui-link.types.js';
|
|
|
53
53
|
export { ProgressSprinkle, ProgressVariants } from './packages/feedback/progress/rarui-progress.types.js';
|
|
54
54
|
export { RadioButtonVariants } from './packages/input/radioButton/rarui-radioButton.types.js';
|
|
55
55
|
export { SelectSprinkle, SelectVariants } from './packages/input/select/rarui-select.types.js';
|
|
56
|
-
export { StatusVariants } from './packages/feedback/status/rarui-status.types.js';
|
|
56
|
+
export { StatusSprinkle, StatusVariants } from './packages/feedback/status/rarui-status.types.js';
|
|
57
57
|
export { BannerVariants } from './packages/surface/banner/rarui-banner.types.js';
|
|
58
58
|
export { TextareaVariants } from './packages/input/textarea/rarui-textarea.types.js';
|
|
59
59
|
export { ToastSprinkle, ToastVariants } from './packages/feedback/toast/rarui-toast.types.js';
|
|
@@ -147,11 +147,11 @@ declare const text: {
|
|
|
147
147
|
};
|
|
148
148
|
lineHeight: {
|
|
149
149
|
values: {
|
|
150
|
-
|
|
150
|
+
xs: {
|
|
151
151
|
default: string;
|
|
152
152
|
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
153
153
|
};
|
|
154
|
-
|
|
154
|
+
xxs: {
|
|
155
155
|
default: string;
|
|
156
156
|
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
157
157
|
};
|
|
@@ -184,11 +184,11 @@ declare const text: {
|
|
|
184
184
|
};
|
|
185
185
|
fontSize: {
|
|
186
186
|
values: {
|
|
187
|
-
|
|
187
|
+
xs: {
|
|
188
188
|
default: string;
|
|
189
189
|
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
190
190
|
};
|
|
191
|
-
|
|
191
|
+
xxs: {
|
|
192
192
|
default: string;
|
|
193
193
|
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
194
194
|
};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { SprinklesFn } from '../../../node_modules/rainbow-sprinkles/dist/declarations/src/createRuntimeFn.d.js';
|
|
1
2
|
import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
|
|
2
3
|
|
|
3
4
|
declare const status: {
|
|
@@ -65,6 +66,22 @@ declare const status: {
|
|
|
65
66
|
};
|
|
66
67
|
}>;
|
|
67
68
|
};
|
|
69
|
+
sprinkle: SprinklesFn<[{
|
|
70
|
+
config: {
|
|
71
|
+
minWidth: {
|
|
72
|
+
dynamic: {
|
|
73
|
+
default: string;
|
|
74
|
+
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
75
|
+
};
|
|
76
|
+
dynamicScale: true;
|
|
77
|
+
name: "minWidth";
|
|
78
|
+
vars: {
|
|
79
|
+
default: string;
|
|
80
|
+
conditions: Record<"xs" | "xl" | "md" | "lg", string>;
|
|
81
|
+
};
|
|
82
|
+
};
|
|
83
|
+
};
|
|
84
|
+
}]>;
|
|
68
85
|
};
|
|
69
86
|
|
|
70
87
|
export { status };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{statusStyles as
|
|
1
|
+
import{statusSprinkle as s,statusStyles as r}from"./rarui-status.css.js";var a={classnames:r,sprinkle:s};export{a as status};
|
|
@@ -105,4 +105,24 @@
|
|
|
105
105
|
.rarui-status_dot_size_small__wfzj07r {
|
|
106
106
|
min-height: .25rem;
|
|
107
107
|
min-width: .25rem;
|
|
108
|
+
}
|
|
109
|
+
@media screen and (min-width: 0px) {
|
|
110
|
+
.rarui-status_minWidth-xs__wfzj07w {
|
|
111
|
+
min-width: var(--minWidth-xs__wfzj07s);
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
@media screen and (min-width: 768px) {
|
|
115
|
+
.rarui-status_minWidth-md__wfzj07x {
|
|
116
|
+
min-width: var(--minWidth-md__wfzj07t);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
@media screen and (min-width: 1200px) {
|
|
120
|
+
.rarui-status_minWidth-lg__wfzj07y {
|
|
121
|
+
min-width: var(--minWidth-lg__wfzj07u);
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
@media screen and (min-width: 1400px) {
|
|
125
|
+
.rarui-status_minWidth-xl__wfzj07z {
|
|
126
|
+
min-width: var(--minWidth-xl__wfzj07v);
|
|
127
|
+
}
|
|
108
128
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var r={status:
|
|
1
|
+
import{c as a}from"../../../node_modules/rainbow-sprinkles/dist/createRuntimeFn-891c4670.esm.js";import{c as t}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var r=a({config:{minWidth:{dynamic:{default:"rarui-status_minWidth-xs__wfzj07w",conditions:{xs:"rarui-status_minWidth-xs__wfzj07w",md:"rarui-status_minWidth-md__wfzj07x",lg:"rarui-status_minWidth-lg__wfzj07y",xl:"rarui-status_minWidth-xl__wfzj07z"}},name:"minWidth",vars:{conditions:{xs:"var(--minWidth-xs__wfzj07s)",md:"var(--minWidth-md__wfzj07t)",lg:"var(--minWidth-lg__wfzj07u)",xl:"var(--minWidth-xl__wfzj07v)"},default:"var(--minWidth-xs__wfzj07s)"},dynamicScale:!0}}}),s={status:t({defaultClassName:"rarui-status__wfzj070",variantClassNames:{full:{true:"rarui-status_full_true__wfzj071"},appearance:{success:"rarui-status_appearance_success__wfzj072",warning:"rarui-status_appearance_warning__wfzj073",danger:"rarui-status_appearance_danger__wfzj074",inverted:"rarui-status_appearance_inverted__wfzj075",neutral:"rarui-status_appearance_neutral__wfzj076",info:"rarui-status_appearance_info__wfzj077"},size:{normal:"rarui-status_size_normal__wfzj078",small:"rarui-status_size_small__wfzj079"},variant:{solid:"rarui-status_variant_solid__wfzj07a",text:"rarui-status_variant_text__wfzj07b",subdued:"rarui-status_variant_subdued__wfzj07c"}},defaultVariants:{appearance:"success",size:"normal",variant:"solid"},compoundVariants:[[{appearance:"success",variant:"text"},"rarui-status__compound_0__wfzj07d"],[{appearance:"warning",variant:"text"},"rarui-status__compound_1__wfzj07e"],[{appearance:"danger",variant:"text"},"rarui-status__compound_2__wfzj07f"],[{appearance:"inverted",variant:"text"},"rarui-status__compound_3__wfzj07g"],[{appearance:"info",variant:"text"},"rarui-status__compound_4__wfzj07h"],[{appearance:"neutral",variant:"text"},"rarui-status__compound_5__wfzj07i"],[{appearance:"success",variant:"subdued"},"rarui-status__compound_6__wfzj07j"],[{appearance:"warning",variant:"subdued"},"rarui-status__compound_7__wfzj07k"],[{appearance:"danger",variant:"subdued"},"rarui-status__compound_8__wfzj07l"],[{appearance:"inverted",variant:"subdued"},"rarui-status__compound_9__wfzj07m"],[{appearance:"neutral",variant:"subdued"},"rarui-status__compound_10__wfzj07n"],[{appearance:"info",variant:"subdued"},"rarui-status__compound_11__wfzj07o"]]}),dot:t({defaultClassName:"rarui-status_dot__wfzj07p",variantClassNames:{size:{normal:"rarui-status_dot_size_normal__wfzj07q",small:"rarui-status_dot_size_small__wfzj07r"}},defaultVariants:{},compoundVariants:[]})};export{r as statusSprinkle,s as statusStyles};
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
|
|
2
|
+
import { StandardLonghandProperties } from '../../../types/css.types.js';
|
|
2
3
|
import { statusStyles } from './rarui-status.css.js';
|
|
3
4
|
|
|
4
5
|
type StatusVariants = NonNullable<RecipeVariants<typeof statusStyles.status>>;
|
|
6
|
+
type StatusDynamicProperties = Pick<StandardLonghandProperties, "minWidth">;
|
|
7
|
+
type StatusSprinkle = StatusDynamicProperties;
|
|
5
8
|
|
|
6
|
-
export type { StatusVariants };
|
|
9
|
+
export type { StatusSprinkle, StatusVariants };
|
|
@@ -19,9 +19,9 @@
|
|
|
19
19
|
border-color: var(--rarui-colors-border-subdued);
|
|
20
20
|
pointer-events: none;
|
|
21
21
|
}
|
|
22
|
-
.rarui-checkbox__1qvfiyr1:
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
.rarui-checkbox__1qvfiyr1:read-only {
|
|
23
|
+
cursor: default;
|
|
24
|
+
pointer-events: none;
|
|
25
25
|
}
|
|
26
26
|
.rarui-checkbox__1qvfiyr1:after {
|
|
27
27
|
content: "";
|
|
@@ -41,6 +41,10 @@
|
|
|
41
41
|
border-bottom: var(--rarui-shape-border-width-2) solid var(--rarui-colors-content-on-brand);
|
|
42
42
|
transform: rotate(-45deg);
|
|
43
43
|
}
|
|
44
|
+
.rarui-checkbox__1qvfiyr1:focus-within:not(:read-only) {
|
|
45
|
+
outline: none;
|
|
46
|
+
box-shadow: var(--rarui-elevation-focus-ring);
|
|
47
|
+
}
|
|
44
48
|
.rarui-checkbox_error_true__1qvfiyr2 {
|
|
45
49
|
border-color: var(--rarui-colors-border-error);
|
|
46
50
|
}
|
|
@@ -86,7 +90,7 @@
|
|
|
86
90
|
pointer-events: none;
|
|
87
91
|
border-radius: inherit;
|
|
88
92
|
}
|
|
89
|
-
.rarui-checkbox_container__1qvfiyr8:hover:not(:has(.rarui-checkbox__1qvfiyr1:disabled)) .rarui-checkbox_overlay__1qvfiyr9 {
|
|
93
|
+
.rarui-checkbox_container__1qvfiyr8:hover:not(:has(.rarui-checkbox__1qvfiyr1:disabled)):not(:has(.rarui-checkbox__1qvfiyr1:read-only)) .rarui-checkbox_overlay__1qvfiyr9 {
|
|
90
94
|
background-color: var(--overlayBackgroundColor__1qvfiyr0);
|
|
91
95
|
border-radius: 50%;
|
|
92
96
|
}
|
|
@@ -6,7 +6,9 @@ declare const radioButton: {
|
|
|
6
6
|
size: {
|
|
7
7
|
small: {
|
|
8
8
|
width: "1.25rem";
|
|
9
|
+
minWidth: "1.25rem";
|
|
9
10
|
height: "1.25rem";
|
|
11
|
+
minHeight: "1.25rem";
|
|
10
12
|
":before": {
|
|
11
13
|
width: "2rem";
|
|
12
14
|
height: "2rem";
|
|
@@ -18,7 +20,9 @@ declare const radioButton: {
|
|
|
18
20
|
};
|
|
19
21
|
large: {
|
|
20
22
|
width: "1.5rem";
|
|
23
|
+
minWidth: "1.5rem";
|
|
21
24
|
height: "1.5rem";
|
|
25
|
+
minHeight: "1.5rem";
|
|
22
26
|
":before": {
|
|
23
27
|
width: "2.75rem";
|
|
24
28
|
height: "2.75rem";
|
|
@@ -54,7 +54,9 @@
|
|
|
54
54
|
}
|
|
55
55
|
.rarui-radioButton_size_small__1d9isw71 {
|
|
56
56
|
width: 1.25rem;
|
|
57
|
+
min-width: 1.25rem;
|
|
57
58
|
height: 1.25rem;
|
|
59
|
+
min-height: 1.25rem;
|
|
58
60
|
}
|
|
59
61
|
.rarui-radioButton_size_small__1d9isw71:before {
|
|
60
62
|
width: 2rem;
|
|
@@ -66,7 +68,9 @@
|
|
|
66
68
|
}
|
|
67
69
|
.rarui-radioButton_size_large__1d9isw72 {
|
|
68
70
|
width: 1.5rem;
|
|
71
|
+
min-width: 1.5rem;
|
|
69
72
|
height: 1.5rem;
|
|
73
|
+
min-height: 1.5rem;
|
|
70
74
|
}
|
|
71
75
|
.rarui-radioButton_size_large__1d9isw72:before {
|
|
72
76
|
width: 2.75rem;
|
|
@@ -8,7 +8,9 @@ declare const styles: {
|
|
|
8
8
|
size: {
|
|
9
9
|
small: {
|
|
10
10
|
width: "1.25rem";
|
|
11
|
+
minWidth: "1.25rem";
|
|
11
12
|
height: "1.25rem";
|
|
13
|
+
minHeight: "1.25rem";
|
|
12
14
|
":before": {
|
|
13
15
|
width: "2rem";
|
|
14
16
|
height: "2rem";
|
|
@@ -20,7 +22,9 @@ declare const styles: {
|
|
|
20
22
|
};
|
|
21
23
|
large: {
|
|
22
24
|
width: "1.5rem";
|
|
25
|
+
minWidth: "1.5rem";
|
|
23
26
|
height: "1.5rem";
|
|
27
|
+
minHeight: "1.5rem";
|
|
24
28
|
":before": {
|
|
25
29
|
width: "2.75rem";
|
|
26
30
|
height: "2.75rem";
|