@webstudio-is/sdk-components-react-radix 0.139.0 → 0.140.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.
@@ -20,6 +20,218 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
20
20
  g: number;
21
21
  b: number;
22
22
  alpha: number;
23
+ } | {
24
+ type: "function";
25
+ name: string;
26
+ args: {
27
+ type: "unit";
28
+ value: number;
29
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
30
+ } | {
31
+ type: "keyword";
32
+ value: string;
33
+ } | {
34
+ type: "unparsed";
35
+ value: string;
36
+ hidden?: boolean | undefined;
37
+ } | {
38
+ type: "fontFamily";
39
+ value: string[];
40
+ } | {
41
+ type: "rgb";
42
+ r: number;
43
+ g: number;
44
+ b: number;
45
+ alpha: number;
46
+ } | any | {
47
+ type: "image";
48
+ value: {
49
+ type: "asset";
50
+ value: string;
51
+ } | {
52
+ type: "url";
53
+ url: string;
54
+ };
55
+ hidden?: boolean | undefined;
56
+ } | {
57
+ type: "tuple";
58
+ value: ({
59
+ type: "unit";
60
+ value: number;
61
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
62
+ } | {
63
+ type: "keyword";
64
+ value: string;
65
+ } | {
66
+ type: "unparsed";
67
+ value: string;
68
+ hidden?: boolean | undefined;
69
+ } | {
70
+ type: "rgb";
71
+ r: number;
72
+ g: number;
73
+ b: number;
74
+ alpha: number;
75
+ } | any)[];
76
+ hidden?: boolean | undefined;
77
+ } | {
78
+ type: "invalid";
79
+ value: string;
80
+ } | {
81
+ type: "layers";
82
+ value: ({
83
+ type: "unit";
84
+ value: number;
85
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
86
+ } | {
87
+ type: "keyword";
88
+ value: string;
89
+ } | {
90
+ type: "unparsed";
91
+ value: string;
92
+ hidden?: boolean | undefined;
93
+ } | any | {
94
+ type: "image";
95
+ value: {
96
+ type: "asset";
97
+ value: string;
98
+ } | {
99
+ type: "url";
100
+ url: string;
101
+ };
102
+ hidden?: boolean | undefined;
103
+ } | {
104
+ type: "tuple";
105
+ value: ({
106
+ type: "unit";
107
+ value: number;
108
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
109
+ } | {
110
+ type: "keyword";
111
+ value: string;
112
+ } | {
113
+ type: "unparsed";
114
+ value: string;
115
+ hidden?: boolean | undefined;
116
+ } | {
117
+ type: "rgb";
118
+ r: number;
119
+ g: number;
120
+ b: number;
121
+ alpha: number;
122
+ } | any)[];
123
+ hidden?: boolean | undefined;
124
+ } | {
125
+ type: "invalid";
126
+ value: string;
127
+ })[];
128
+ } | {
129
+ type: "unset";
130
+ value: "";
131
+ } | {
132
+ type: "var";
133
+ value: string;
134
+ fallbacks: ({
135
+ type: "unit";
136
+ value: number;
137
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
138
+ } | {
139
+ type: "keyword";
140
+ value: string;
141
+ } | {
142
+ type: "unparsed";
143
+ value: string;
144
+ hidden?: boolean | undefined;
145
+ } | {
146
+ type: "fontFamily";
147
+ value: string[];
148
+ } | {
149
+ type: "rgb";
150
+ r: number;
151
+ g: number;
152
+ b: number;
153
+ alpha: number;
154
+ } | any | {
155
+ type: "image";
156
+ value: {
157
+ type: "asset";
158
+ value: string;
159
+ } | {
160
+ type: "url";
161
+ url: string;
162
+ };
163
+ hidden?: boolean | undefined;
164
+ } | {
165
+ type: "tuple";
166
+ value: ({
167
+ type: "unit";
168
+ value: number;
169
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
170
+ } | {
171
+ type: "keyword";
172
+ value: string;
173
+ } | {
174
+ type: "unparsed";
175
+ value: string;
176
+ hidden?: boolean | undefined;
177
+ } | {
178
+ type: "rgb";
179
+ r: number;
180
+ g: number;
181
+ b: number;
182
+ alpha: number;
183
+ } | any)[];
184
+ hidden?: boolean | undefined;
185
+ } | {
186
+ type: "layers";
187
+ value: ({
188
+ type: "unit";
189
+ value: number;
190
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
191
+ } | {
192
+ type: "keyword";
193
+ value: string;
194
+ } | {
195
+ type: "unparsed";
196
+ value: string;
197
+ hidden?: boolean | undefined;
198
+ } | any | {
199
+ type: "image";
200
+ value: {
201
+ type: "asset";
202
+ value: string;
203
+ } | {
204
+ type: "url";
205
+ url: string;
206
+ };
207
+ hidden?: boolean | undefined;
208
+ } | {
209
+ type: "tuple";
210
+ value: ({
211
+ type: "unit";
212
+ value: number;
213
+ unit: "number" | "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";
214
+ } | {
215
+ type: "keyword";
216
+ value: string;
217
+ } | {
218
+ type: "unparsed";
219
+ value: string;
220
+ hidden?: boolean | undefined;
221
+ } | {
222
+ type: "rgb";
223
+ r: number;
224
+ g: number;
225
+ b: number;
226
+ alpha: number;
227
+ } | any)[];
228
+ hidden?: boolean | undefined;
229
+ } | {
230
+ type: "invalid";
231
+ value: string;
232
+ })[];
233
+ })[];
234
+ };
23
235
  } | {
24
236
  type: "image";
25
237
  value: {
@@ -30,12 +242,6 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
30
242
  url: string;
31
243
  };
32
244
  hidden?: boolean | undefined;
33
- } | {
34
- type: "invalid";
35
- value: string;
36
- } | {
37
- type: "unset";
38
- value: "";
39
245
  } | {
40
246
  type: "tuple";
41
247
  value: ({
@@ -55,8 +261,11 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
55
261
  g: number;
56
262
  b: number;
57
263
  alpha: number;
58
- })[];
264
+ } | any)[];
59
265
  hidden?: boolean | undefined;
266
+ } | {
267
+ type: "invalid";
268
+ value: string;
60
269
  } | {
61
270
  type: "layers";
62
271
  value: ({
@@ -70,7 +279,7 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
70
279
  type: "unparsed";
71
280
  value: string;
72
281
  hidden?: boolean | undefined;
73
- } | {
282
+ } | any | {
74
283
  type: "image";
75
284
  value: {
76
285
  type: "asset";
@@ -80,9 +289,6 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
80
289
  url: string;
81
290
  };
82
291
  hidden?: boolean | undefined;
83
- } | {
84
- type: "invalid";
85
- value: string;
86
292
  } | {
87
293
  type: "tuple";
88
294
  value: ({
@@ -102,9 +308,15 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
102
308
  g: number;
103
309
  b: number;
104
310
  alpha: number;
105
- })[];
311
+ } | any)[];
106
312
  hidden?: boolean | undefined;
313
+ } | {
314
+ type: "invalid";
315
+ value: string;
107
316
  })[];
317
+ } | {
318
+ type: "unset";
319
+ value: "";
108
320
  } | {
109
321
  type: "var";
110
322
  value: string;
@@ -128,7 +340,7 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
128
340
  g: number;
129
341
  b: number;
130
342
  alpha: number;
131
- } | {
343
+ } | any | {
132
344
  type: "image";
133
345
  value: {
134
346
  type: "asset";
@@ -157,7 +369,7 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
157
369
  g: number;
158
370
  b: number;
159
371
  alpha: number;
160
- })[];
372
+ } | any)[];
161
373
  hidden?: boolean | undefined;
162
374
  } | {
163
375
  type: "layers";
@@ -172,7 +384,7 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
172
384
  type: "unparsed";
173
385
  value: string;
174
386
  hidden?: boolean | undefined;
175
- } | {
387
+ } | any | {
176
388
  type: "image";
177
389
  value: {
178
390
  type: "asset";
@@ -182,9 +394,6 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
182
394
  url: string;
183
395
  };
184
396
  hidden?: boolean | undefined;
185
- } | {
186
- type: "invalid";
187
- value: string;
188
397
  } | {
189
398
  type: "tuple";
190
399
  value: ({
@@ -204,8 +413,11 @@ export declare const getButtonStyles: (variant: "outline" | "ghost", size?: "def
204
413
  g: number;
205
414
  b: number;
206
415
  alpha: number;
207
- })[];
416
+ } | any)[];
208
417
  hidden?: boolean | undefined;
418
+ } | {
419
+ type: "invalid";
420
+ value: string;
209
421
  })[];
210
422
  })[];
211
423
  };
@@ -12,7 +12,7 @@ type StringEnumToNumeric<T extends string> = T extends `${infer Z extends number
12
12
  type NonNumeric<T extends string> = T extends `${infer Z extends number}` ? never : T;
13
13
  export declare const border: (borderWidthOrColor?: StringEnumToNumeric<keyof typeof theme.borderWidth> | keyof typeof theme.colors) => EmbedTemplateStyleDecl[];
14
14
  export declare const borderB: (borderWidthOrColor?: StringEnumToNumeric<keyof typeof theme.borderWidth> | keyof typeof theme.colors) => EmbedTemplateStyleDecl[];
15
- declare const paddingProperty: (property: "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft") => (padding: 0 | 1 | "px" | 2 | 4 | 6 | 8 | 14 | 3 | 5 | 7 | 9 | 10 | 11 | 12 | 16 | 32 | 48 | 64 | 96 | 80 | 0.5 | 1.5 | 2.5 | 3.5 | 20 | 24 | 40 | 60 | 28 | 36 | 56 | 72 | 44 | 52) => EmbedTemplateStyleDecl[];
15
+ declare const paddingProperty: (property: "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft") => (padding: 0 | 1 | "px" | 2 | 5 | 7 | 9 | 4 | 14 | 3 | 6 | 8 | 10 | 11 | 12 | 16 | 32 | 48 | 64 | 96 | 80 | 0.5 | 1.5 | 2.5 | 3.5 | 20 | 24 | 40 | 60 | 28 | 36 | 56 | 72 | 44 | 52) => EmbedTemplateStyleDecl[];
16
16
  export declare const pt: ReturnType<typeof paddingProperty>;
17
17
  export declare const pb: ReturnType<typeof paddingProperty>;
18
18
  export declare const pl: ReturnType<typeof paddingProperty>;
@@ -20,7 +20,7 @@ export declare const pr: ReturnType<typeof paddingProperty>;
20
20
  export declare const px: ReturnType<typeof paddingProperty>;
21
21
  export declare const py: ReturnType<typeof paddingProperty>;
22
22
  export declare const p: ReturnType<typeof paddingProperty>;
23
- declare const marginProperty: (property: "marginTop" | "marginRight" | "marginBottom" | "marginLeft") => (margin: 0 | 1 | "px" | 2 | 4 | 6 | 8 | 14 | 3 | "auto" | 5 | 7 | 9 | 10 | 11 | 12 | 16 | 32 | 48 | 64 | 96 | 80 | 0.5 | 1.5 | 2.5 | 3.5 | 20 | 24 | 40 | 60 | 28 | 36 | 56 | 72 | 44 | 52) => EmbedTemplateStyleDecl[];
23
+ declare const marginProperty: (property: "marginTop" | "marginRight" | "marginBottom" | "marginLeft") => (margin: 0 | 1 | "px" | 2 | 5 | 7 | 9 | 4 | 14 | 3 | "auto" | 6 | 8 | 10 | 11 | 12 | 16 | 32 | 48 | 64 | 96 | 80 | 0.5 | 1.5 | 2.5 | 3.5 | 20 | 24 | 40 | 60 | 28 | 36 | 56 | 72 | 44 | 52) => EmbedTemplateStyleDecl[];
24
24
  export declare const ml: ReturnType<typeof marginProperty>;
25
25
  export declare const mr: ReturnType<typeof marginProperty>;
26
26
  export declare const mt: ReturnType<typeof marginProperty>;
@@ -81,7 +81,7 @@ export declare const grow: () => EmbedTemplateStyleDecl[];
81
81
  export declare const shrink: (value: number) => EmbedTemplateStyleDecl[];
82
82
  export declare const gap: (gapValue: StringEnumToNumeric<keyof typeof theme.spacing>) => EmbedTemplateStyleDecl[];
83
83
  export declare const lineClamp: (lineClampValue: StringEnumToNumeric<keyof typeof theme.lineClamp>) => EmbedTemplateStyleDecl[];
84
- export declare const leading: (lineHeight: 4 | 6 | 8 | "normal" | 3 | "none" | 5 | 7 | 9 | 10 | "tight" | "snug" | "relaxed" | "loose") => EmbedTemplateStyleDecl[];
84
+ export declare const leading: (lineHeight: 5 | 7 | 9 | 4 | "normal" | 3 | "none" | 6 | 8 | 10 | "tight" | "snug" | "relaxed" | "loose") => EmbedTemplateStyleDecl[];
85
85
  export declare const tracking: (letterSpacing: "normal" | "tight" | "tighter" | "wide" | "wider" | "widest") => EmbedTemplateStyleDecl[];
86
86
  export declare const outline: (_value: "none") => EmbedTemplateStyleDecl[];
87
87
  type TextSize = keyof typeof theme.fontSize;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webstudio-is/sdk-components-react-radix",
3
- "version": "0.139.0",
3
+ "version": "0.140.0",
4
4
  "description": "Webstudio wrapper for radix library",
5
5
  "author": "Webstudio <github@webstudio.is>",
6
6
  "homepage": "https://webstudio.is",
@@ -55,9 +55,9 @@
55
55
  "@radix-ui/react-switch": "^1.0.3",
56
56
  "@radix-ui/react-tabs": "^1.0.4",
57
57
  "@radix-ui/react-tooltip": "^1.0.7",
58
- "@webstudio-is/icons": "0.139.0",
59
- "@webstudio-is/css-engine": "0.139.0",
60
- "@webstudio-is/react-sdk": "0.139.0"
58
+ "@webstudio-is/css-engine": "0.140.0",
59
+ "@webstudio-is/icons": "0.140.0",
60
+ "@webstudio-is/react-sdk": "0.140.0"
61
61
  },
62
62
  "devDependencies": {
63
63
  "@storybook/react": "^7.4.0",
@@ -67,11 +67,11 @@
67
67
  "react-dom": "^18.2.0",
68
68
  "tailwindcss": "^3.3.3",
69
69
  "typescript": "^5.2.2",
70
+ "@webstudio-is/generate-arg-types": "0.140.0",
71
+ "@webstudio-is/css-data": "0.140.0",
70
72
  "@webstudio-is/sdk-cli": "^0.94.0",
71
- "@webstudio-is/css-data": "0.139.0",
72
- "@webstudio-is/generate-arg-types": "0.139.0",
73
+ "@webstudio-is/sdk-components-react": "0.140.0",
73
74
  "@webstudio-is/storybook-config": "0.0.0",
74
- "@webstudio-is/sdk-components-react": "0.139.0",
75
75
  "@webstudio-is/tsconfig": "1.0.7"
76
76
  },
77
77
  "scripts": {