@webstudio-is/sdk-components-react-radix 0.90.0 → 0.92.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.
Files changed (199) hide show
  1. package/lib/__generated__/accordion.props.js +6 -12
  2. package/lib/__generated__/checkbox.props.js +3 -6
  3. package/lib/__generated__/collapsible.props.js +4 -8
  4. package/lib/__generated__/dialog.props.js +8 -16
  5. package/lib/__generated__/label.props.js +2 -4
  6. package/lib/__generated__/navigation-menu.props.js +8 -16
  7. package/lib/__generated__/popover.props.js +4 -8
  8. package/lib/__generated__/radio-group.props.js +4 -8
  9. package/lib/__generated__/select.props.js +15 -19
  10. package/lib/__generated__/sheet.props.js +8 -16
  11. package/lib/__generated__/switch.props.js +3 -6
  12. package/lib/__generated__/tabs.props.js +5 -10
  13. package/lib/__generated__/tooltip.props.js +4 -8
  14. package/lib/accordion.js +7 -14
  15. package/{src/accordion.stories.tsx → lib/accordion.stories.js} +9 -12
  16. package/lib/accordion.ws.js +11 -22
  17. package/lib/checkbox.js +3 -6
  18. package/lib/checkbox.stories.js +19 -0
  19. package/lib/checkbox.ws.js +5 -10
  20. package/lib/collapsible.js +5 -10
  21. package/{src/collapsible.stories.tsx → lib/collapsible.stories.js} +9 -12
  22. package/lib/collapsible.ws.js +7 -14
  23. package/lib/components.js +13 -62
  24. package/lib/dialog.js +9 -18
  25. package/{src/dialog.stories.tsx → lib/dialog.stories.js} +9 -12
  26. package/lib/dialog.ws.js +17 -30
  27. package/lib/hooks.js +2 -4
  28. package/lib/label.js +2 -4
  29. package/lib/label.stories.js +19 -0
  30. package/lib/label.ws.js +3 -6
  31. package/lib/metas.js +55 -105
  32. package/lib/navigation-menu.js +9 -18
  33. package/{src/navigation-menu.stories.tsx → lib/navigation-menu.stories.js} +9 -12
  34. package/lib/navigation-menu.ws.js +16 -31
  35. package/lib/popover.js +5 -10
  36. package/{src/popover.stories.tsx → lib/popover.stories.js} +9 -12
  37. package/lib/popover.ws.js +7 -14
  38. package/lib/props-descriptions.js +2 -4
  39. package/lib/props.js +54 -103
  40. package/lib/radio-group.js +4 -8
  41. package/lib/radio-group.stories.js +19 -0
  42. package/lib/radio-group.ws.js +7 -14
  43. package/lib/select.js +10 -20
  44. package/{src/select.stories.tsx → lib/select.stories.js} +9 -12
  45. package/lib/select.ws.js +17 -34
  46. package/lib/sheet.js +9 -18
  47. package/{src/sheet.stories.tsx → lib/sheet.stories.js} +9 -12
  48. package/lib/sheet.ws.js +2 -4
  49. package/lib/switch.js +3 -6
  50. package/lib/switch.stories.js +19 -0
  51. package/lib/switch.ws.js +5 -10
  52. package/lib/tabs.js +6 -12
  53. package/{src/tabs.stories.tsx → lib/tabs.stories.js} +9 -12
  54. package/lib/tabs.ws.js +9 -18
  55. package/lib/theme/__generated__/tailwind-theme.js +517 -0
  56. package/lib/theme/styles.js +3 -6
  57. package/lib/theme/tailwind-classes.js +149 -301
  58. package/lib/theme/tailwind-colors.js +2 -4
  59. package/lib/tooltip.js +5 -10
  60. package/{src/tooltip.stories.tsx → lib/tooltip.stories.js} +9 -12
  61. package/lib/tooltip.ws.js +7 -14
  62. package/lib/types/__generated__/accordion.props.d.ts +1 -1
  63. package/lib/types/__generated__/checkbox.props.d.ts +1 -1
  64. package/lib/types/__generated__/collapsible.props.d.ts +1 -1
  65. package/lib/types/__generated__/dialog.props.d.ts +1 -1
  66. package/lib/types/__generated__/label.props.d.ts +1 -1
  67. package/lib/types/__generated__/navigation-menu.props.d.ts +1 -1
  68. package/lib/types/__generated__/popover.props.d.ts +1 -1
  69. package/lib/types/__generated__/radio-group.props.d.ts +1 -1
  70. package/lib/types/__generated__/select.props.d.ts +1 -1
  71. package/lib/types/__generated__/sheet.props.d.ts +1 -1
  72. package/lib/types/__generated__/switch.props.d.ts +1 -1
  73. package/lib/types/__generated__/tabs.props.d.ts +1 -1
  74. package/lib/types/__generated__/tooltip.props.d.ts +1 -1
  75. package/lib/types/accordion.d.ts +1 -1
  76. package/lib/types/sheet.d.ts +1 -1
  77. package/lib/types/theme/__generated__/tailwind-theme.d.ts +26 -0
  78. package/lib/types/theme/styles.d.ts +60 -60
  79. package/lib/types/theme/tailwind-classes.d.ts +33 -33
  80. package/package.json +20 -23
  81. package/lib/__generated__/button.props.js +0 -565
  82. package/lib/__generated__/input.props.js +0 -668
  83. package/lib/__generated__/textarea.props.js +0 -577
  84. package/lib/cjs/__generated__/accordion.props.js +0 -2645
  85. package/lib/cjs/__generated__/button.props.js +0 -585
  86. package/lib/cjs/__generated__/checkbox.props.js +0 -1103
  87. package/lib/cjs/__generated__/collapsible.props.js +0 -1050
  88. package/lib/cjs/__generated__/dialog.props.js +0 -2623
  89. package/lib/cjs/__generated__/input.props.js +0 -688
  90. package/lib/cjs/__generated__/label.props.js +0 -541
  91. package/lib/cjs/__generated__/navigation-menu.props.js +0 -2585
  92. package/lib/cjs/__generated__/popover.props.js +0 -582
  93. package/lib/cjs/__generated__/radio-group.props.js +0 -1647
  94. package/lib/cjs/__generated__/select.props.js +0 -3698
  95. package/lib/cjs/__generated__/sheet.props.js +0 -2642
  96. package/lib/cjs/__generated__/switch.props.js +0 -1103
  97. package/lib/cjs/__generated__/tabs.props.js +0 -2144
  98. package/lib/cjs/__generated__/textarea.props.js +0 -597
  99. package/lib/cjs/__generated__/tooltip.props.js +0 -593
  100. package/lib/cjs/accordion.js +0 -67
  101. package/lib/cjs/accordion.ws.js +0 -285
  102. package/lib/cjs/checkbox.js +0 -31
  103. package/lib/cjs/checkbox.ws.js +0 -174
  104. package/lib/cjs/collapsible.js +0 -53
  105. package/lib/cjs/collapsible.ws.js +0 -122
  106. package/lib/cjs/components.js +0 -82
  107. package/lib/cjs/dialog.js +0 -89
  108. package/lib/cjs/dialog.ws.js +0 -314
  109. package/lib/cjs/hooks.js +0 -43
  110. package/lib/cjs/label.js +0 -37
  111. package/lib/cjs/label.ws.js +0 -75
  112. package/lib/cjs/metas.js +0 -84
  113. package/lib/cjs/navigation-menu.js +0 -107
  114. package/lib/cjs/navigation-menu.ws.js +0 -514
  115. package/lib/cjs/package.json +0 -1
  116. package/lib/cjs/popover.js +0 -90
  117. package/lib/cjs/popover.ws.js +0 -142
  118. package/lib/cjs/props-descriptions.js +0 -56
  119. package/lib/cjs/props.js +0 -82
  120. package/lib/cjs/radio-group.js +0 -30
  121. package/lib/cjs/radio-group.ws.js +0 -191
  122. package/lib/cjs/select.js +0 -83
  123. package/lib/cjs/select.ws.js +0 -350
  124. package/lib/cjs/sheet.js +0 -96
  125. package/lib/cjs/sheet.ws.js +0 -257
  126. package/lib/cjs/switch.js +0 -27
  127. package/lib/cjs/switch.ws.js +0 -173
  128. package/lib/cjs/tabs.js +0 -59
  129. package/lib/cjs/tabs.ws.js +0 -196
  130. package/lib/cjs/theme/radix-common-types.js +0 -16
  131. package/lib/cjs/theme/styles.js +0 -96
  132. package/lib/cjs/theme/tailwind-classes.js +0 -819
  133. package/lib/cjs/theme/tailwind-colors.js +0 -45
  134. package/lib/cjs/theme/tailwind-theme.js +0 -46
  135. package/lib/cjs/tooltip.js +0 -87
  136. package/lib/cjs/tooltip.ws.js +0 -143
  137. package/lib/theme/radix-common-types.js +0 -0
  138. package/lib/theme/tailwind-theme.js +0 -16
  139. package/lib/types/__generated__/button.props.d.ts +0 -2
  140. package/lib/types/__generated__/input.props.d.ts +0 -2
  141. package/lib/types/__generated__/textarea.props.d.ts +0 -2
  142. package/lib/types/theme/radix-common-types.d.ts +0 -85
  143. package/lib/types/theme/tailwind-theme.d.ts +0 -72
  144. package/src/__generated__/accordion.props.ts +0 -2949
  145. package/src/__generated__/button.props.ts +0 -635
  146. package/src/__generated__/checkbox.props.ts +0 -1217
  147. package/src/__generated__/collapsible.props.ts +0 -1156
  148. package/src/__generated__/dialog.props.ts +0 -2923
  149. package/src/__generated__/input.props.ts +0 -748
  150. package/src/__generated__/label.props.ts +0 -585
  151. package/src/__generated__/navigation-menu.props.ts +0 -2882
  152. package/src/__generated__/popover.props.ts +0 -626
  153. package/src/__generated__/radio-group.props.ts +0 -1828
  154. package/src/__generated__/select.props.ts +0 -4130
  155. package/src/__generated__/sheet.props.ts +0 -2942
  156. package/src/__generated__/switch.props.ts +0 -1217
  157. package/src/__generated__/tabs.props.ts +0 -2386
  158. package/src/__generated__/textarea.props.ts +0 -645
  159. package/src/__generated__/tooltip.props.ts +0 -639
  160. package/src/accordion.tsx +0 -88
  161. package/src/accordion.ws.ts +0 -296
  162. package/src/checkbox.stories.ts +0 -22
  163. package/src/checkbox.tsx +0 -22
  164. package/src/checkbox.ws.ts +0 -154
  165. package/src/collapsible.tsx +0 -62
  166. package/src/collapsible.ws.ts +0 -115
  167. package/src/components.ts +0 -50
  168. package/src/dialog.tsx +0 -92
  169. package/src/dialog.ws.tsx +0 -318
  170. package/src/hooks.ts +0 -22
  171. package/src/label.stories.ts +0 -22
  172. package/src/label.tsx +0 -15
  173. package/src/label.ws.ts +0 -50
  174. package/src/metas.ts +0 -74
  175. package/src/navigation-menu.tsx +0 -130
  176. package/src/navigation-menu.ws.ts +0 -524
  177. package/src/popover.tsx +0 -96
  178. package/src/popover.ws.tsx +0 -128
  179. package/src/props-descriptions.ts +0 -43
  180. package/src/props.ts +0 -73
  181. package/src/radio-group.stories.ts +0 -22
  182. package/src/radio-group.tsx +0 -17
  183. package/src/radio-group.ws.ts +0 -178
  184. package/src/select.tsx +0 -112
  185. package/src/select.ws.ts +0 -349
  186. package/src/sheet.tsx +0 -79
  187. package/src/sheet.ws.tsx +0 -236
  188. package/src/switch.stories.ts +0 -22
  189. package/src/switch.tsx +0 -10
  190. package/src/switch.ws.ts +0 -146
  191. package/src/tabs.tsx +0 -64
  192. package/src/tabs.ws.ts +0 -198
  193. package/src/theme/radix-common-types.ts +0 -496
  194. package/src/theme/styles.ts +0 -76
  195. package/src/theme/tailwind-classes.ts +0 -1026
  196. package/src/theme/tailwind-colors.ts +0 -39
  197. package/src/theme/tailwind-theme.ts +0 -24
  198. package/src/tooltip.tsx +0 -95
  199. package/src/tooltip.ws.tsx +0 -130
@@ -1,45 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var tailwind_colors_exports = {};
20
- __export(tailwind_colors_exports, {
21
- colors: () => colors
22
- });
23
- module.exports = __toCommonJS(tailwind_colors_exports);
24
- const colors = {
25
- transparent: "transparent",
26
- current: "currentColor",
27
- inherit: "inherit",
28
- popover: "rgb(255, 255, 255)",
29
- popoverForeground: "rgb(2, 8, 23)",
30
- border: "rgb(226, 232, 240)",
31
- background: "rgb(255, 255, 255)",
32
- foreground: "hsl(222.2 84% 4.9%)",
33
- ring: "rgb(148, 163, 184)",
34
- mutedForeground: "rgb(100, 116, 139)",
35
- muted: `hsl(210 40% 96.1%)`,
36
- primary: "rgb(15, 23, 42)",
37
- primaryForeground: "hsl(210 40% 98%)",
38
- destructive: "rgb(239, 68, 68)",
39
- destructiveForeground: "rgb(248, 250, 252)",
40
- accent: "rgb(241, 245, 249)",
41
- accentForeground: "rgb(15, 23, 42)",
42
- input: "rgb(226, 232, 240)",
43
- secondary: "rgb(241, 245, 249)",
44
- secondaryForeground: "rgb(15, 23, 42)"
45
- };
@@ -1,46 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var tailwind_theme_exports = {};
30
- __export(tailwind_theme_exports, {
31
- theme: () => theme
32
- });
33
- module.exports = __toCommonJS(tailwind_theme_exports);
34
- var import_defaultTheme = __toESM(require("tailwindcss/defaultTheme"), 1);
35
- var import_tailwind_colors = require("./tailwind-colors");
36
- const localTheme = { ...import_defaultTheme.default };
37
- const theme = (name) => {
38
- const value = localTheme?.[name];
39
- if (typeof value === "function") {
40
- return value({ theme, colors: import_tailwind_colors.colors, breakpoints: () => ({}) });
41
- }
42
- return value;
43
- };
44
- localTheme.colors = import_tailwind_colors.colors;
45
- localTheme.borderRadius = { ...theme("borderRadius") };
46
- localTheme.borderRadius.DEFAULT = "0.5rem";
@@ -1,87 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var tooltip_exports = {};
30
- __export(tooltip_exports, {
31
- Tooltip: () => Tooltip,
32
- TooltipContent: () => TooltipContent,
33
- TooltipTrigger: () => TooltipTrigger,
34
- hooksTooltip: () => hooksTooltip
35
- });
36
- module.exports = __toCommonJS(tooltip_exports);
37
- var import_jsx_runtime = require("react/jsx-runtime");
38
- var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
39
- var import_react_sdk = require("@webstudio-is/react-sdk");
40
- var import_react = require("react");
41
- const Tooltip = (0, import_react.forwardRef)((props, _ref) => {
42
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TooltipPrimitive.Provider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TooltipPrimitive.Root, { ...props }) });
43
- });
44
- const TooltipTrigger = (0, import_react.forwardRef)(({ children, ...props }, ref) => {
45
- const firstChild = import_react.Children.toArray(children)[0];
46
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TooltipPrimitive.Trigger, { asChild: true, ref, ...props, children: firstChild ?? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { children: "Add button or link" }) });
47
- });
48
- const TooltipContent = (0, import_react.forwardRef)(({ sideOffset = 4, hideWhenDetached = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TooltipPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
49
- TooltipPrimitive.Content,
50
- {
51
- ref,
52
- hideWhenDetached,
53
- sideOffset,
54
- ...props
55
- }
56
- ) }));
57
- const namespace = "@webstudio-is/sdk-components-react-radix";
58
- const hooksTooltip = {
59
- onNavigatorUnselect: (context, event) => {
60
- for (const instance of event.instancePath) {
61
- if (instance.component === `${namespace}:TooltipContent`) {
62
- const tooltip = (0, import_react_sdk.getClosestInstance)(
63
- event.instancePath,
64
- instance,
65
- `${namespace}:Tooltip`
66
- );
67
- if (tooltip) {
68
- context.setPropVariable(tooltip.id, "open", false);
69
- }
70
- }
71
- }
72
- },
73
- onNavigatorSelect: (context, event) => {
74
- for (const instance of event.instancePath) {
75
- if (instance.component === `${namespace}:TooltipContent`) {
76
- const tooltip = (0, import_react_sdk.getClosestInstance)(
77
- event.instancePath,
78
- instance,
79
- `${namespace}:Tooltip`
80
- );
81
- if (tooltip) {
82
- context.setPropVariable(tooltip.id, "open", true);
83
- }
84
- }
85
- }
86
- }
87
- };
@@ -1,143 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var tooltip_ws_exports = {};
30
- __export(tooltip_ws_exports, {
31
- metaTooltip: () => metaTooltip,
32
- metaTooltipContent: () => metaTooltipContent,
33
- metaTooltipTrigger: () => metaTooltipTrigger,
34
- propsMetaTooltip: () => propsMetaTooltip,
35
- propsMetaTooltipContent: () => propsMetaTooltipContent,
36
- propsMetaTooltipTrigger: () => propsMetaTooltipTrigger
37
- });
38
- module.exports = __toCommonJS(tooltip_ws_exports);
39
- var import_svg = require("@webstudio-is/icons/svg");
40
- var import_react_sdk = require("@webstudio-is/react-sdk");
41
- var import_css_normalize = require("@webstudio-is/react-sdk/css-normalize");
42
- var tc = __toESM(require("./theme/tailwind-classes"), 1);
43
- var import_tooltip = require("./__generated__/tooltip.props");
44
- var import_styles = require("./theme/styles");
45
- const presetStyle = {
46
- div: import_css_normalize.div
47
- };
48
- const metaTooltipTrigger = {
49
- category: "hidden",
50
- detachable: false,
51
- type: "container",
52
- icon: import_svg.TriggerIcon,
53
- stylable: false
54
- };
55
- const metaTooltipContent = {
56
- category: "hidden",
57
- detachable: false,
58
- type: "container",
59
- presetStyle,
60
- icon: import_svg.ContentIcon
61
- };
62
- const metaTooltip = {
63
- category: "radix",
64
- order: 7,
65
- type: "container",
66
- icon: import_svg.TooltipIcon,
67
- stylable: false,
68
- description: "Displays content that is related to the trigger, when the trigger is hovered with the mouse or focused with the keyboard. You are reading an example of a tooltip right now.",
69
- template: [
70
- {
71
- type: "instance",
72
- component: "Tooltip",
73
- dataSources: {
74
- tooltipOpen: { type: "variable", initialValue: false }
75
- },
76
- props: [
77
- {
78
- type: "dataSource",
79
- name: "open",
80
- dataSourceName: "tooltipOpen"
81
- },
82
- {
83
- name: "onOpenChange",
84
- type: "action",
85
- value: [
86
- { type: "execute", args: ["open"], code: `tooltipOpen = open` }
87
- ]
88
- }
89
- ],
90
- children: [
91
- {
92
- type: "instance",
93
- component: "TooltipTrigger",
94
- children: [
95
- {
96
- type: "instance",
97
- component: "Button",
98
- styles: (0, import_styles.getButtonStyles)("outline"),
99
- children: [{ type: "text", value: "Button" }]
100
- }
101
- ]
102
- },
103
- {
104
- type: "instance",
105
- component: "TooltipContent",
106
- /**
107
- * z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md
108
- **/
109
- styles: [
110
- tc.z(50),
111
- tc.overflow("hidden"),
112
- tc.rounded("md"),
113
- tc.border(),
114
- tc.bg("popover"),
115
- tc.px(3),
116
- tc.py(1.5),
117
- tc.text("sm"),
118
- tc.text("popoverForeground"),
119
- tc.shadow("md")
120
- ].flat(),
121
- children: [
122
- {
123
- type: "instance",
124
- component: "Text",
125
- children: [{ type: "text", value: "The text you can edit" }]
126
- }
127
- ]
128
- }
129
- ]
130
- }
131
- ]
132
- };
133
- const propsMetaTooltip = {
134
- props: import_tooltip.propsTooltip,
135
- initialProps: ["open", "delayDuration", "disableHoverableContent"]
136
- };
137
- const propsMetaTooltipTrigger = {
138
- props: import_tooltip.propsTooltipTrigger
139
- };
140
- const propsMetaTooltipContent = {
141
- props: import_tooltip.propsTooltipContent,
142
- initialProps: ["side", "sideOffset", "align", "alignOffset"]
143
- };
File without changes
@@ -1,16 +0,0 @@
1
- import defaultTheme from "tailwindcss/defaultTheme";
2
- import { colors } from "./tailwind-colors";
3
- const localTheme = { ...defaultTheme };
4
- const theme = (name) => {
5
- const value = localTheme?.[name];
6
- if (typeof value === "function") {
7
- return value({ theme, colors, breakpoints: () => ({}) });
8
- }
9
- return value;
10
- };
11
- localTheme.colors = colors;
12
- localTheme.borderRadius = { ...theme("borderRadius") };
13
- localTheme.borderRadius.DEFAULT = "0.5rem";
14
- export {
15
- theme
16
- };
@@ -1,2 +0,0 @@
1
- import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
- export declare const props: Record<string, PropMeta>;
@@ -1,2 +0,0 @@
1
- import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
- export declare const props: Record<string, PropMeta>;
@@ -1,2 +0,0 @@
1
- import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
- export declare const props: Record<string, PropMeta>;
@@ -1,85 +0,0 @@
1
- import type { colors } from "./tailwind-colors";
2
- type DefaultTheme = {
3
- animation: Record<"none" | "spin" | "ping" | "pulse" | "bounce", string>;
4
- aria: Record<"busy" | "checked" | "disabled" | "expanded" | "hidden" | "pressed" | "readonly" | "required" | "selected", string>;
5
- aspectRatio: Record<"auto" | "square" | "video", string>;
6
- backgroundImage: Record<"none" | "gradient-to-t" | "gradient-to-tr" | "gradient-to-r" | "gradient-to-br" | "gradient-to-b" | "gradient-to-bl" | "gradient-to-l" | "gradient-to-tl", string>;
7
- backgroundPosition: Record<"bottom" | "center" | "left" | "left-bottom" | "left-top" | "right" | "right-bottom" | "right-top" | "top", string>;
8
- backgroundSize: Record<"auto" | "cover" | "contain", string>;
9
- blur: Record<"0" | "none" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "3xl", string>;
10
- borderRadius: Record<"none" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full", string>;
11
- borderWidth: Record<"0" | "2" | "4" | "8" | "DEFAULT", string>;
12
- boxShadow: Record<"sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "inner" | "none", string>;
13
- brightness: Record<"0" | "50" | "75" | "90" | "95" | "100" | "105" | "110" | "125" | "150" | "200", string>;
14
- columns: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "auto" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl", string>;
15
- content: Record<"none", string>;
16
- contrast: Record<"0" | "50" | "75" | "100" | "125" | "150" | "200", string>;
17
- cursor: Record<"auto" | "default" | "pointer" | "wait" | "text" | "move" | "help" | "not-allowed" | "none" | "context-menu" | "progress" | "cell" | "crosshair" | "vertical-text" | "alias" | "copy" | "no-drop" | "grab" | "grabbing" | "all-scroll" | "col-resize" | "row-resize" | "n-resize" | "e-resize" | "s-resize" | "w-resize" | "ne-resize" | "nw-resize" | "se-resize" | "sw-resize" | "ew-resize" | "ns-resize" | "nesw-resize" | "nwse-resize" | "zoom-in" | "zoom-out", string>;
18
- dropShadow: Record<"sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "none", string | string[]>;
19
- flex: Record<"1" | "auto" | "initial" | "none", string>;
20
- flexGrow: Record<"0" | "DEFAULT", string>;
21
- flexShrink: Record<"0" | "DEFAULT", string>;
22
- fontFamily: Record<"sans" | "serif" | "mono", string[]>;
23
- fontSize: Record<"xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl", [
24
- string,
25
- {
26
- lineHeight: string;
27
- }
28
- ]>;
29
- fontWeight: Record<"thin" | "extralight" | "light" | "normal" | "medium" | "semibold" | "bold" | "extrabold" | "black", string>;
30
- gradientColorStopPositions: Record<"0%" | "5%" | "10%" | "15%" | "20%" | "25%" | "30%" | "35%" | "40%" | "45%" | "50%" | "55%" | "60%" | "65%" | "70%" | "75%" | "80%" | "85%" | "90%" | "95%" | "100%", string>;
31
- grayscale: Record<"0" | "DEFAULT", string>;
32
- gridAutoColumns: Record<"auto" | "min" | "max" | "fr", string>;
33
- gridAutoRows: Record<"auto" | "min" | "max" | "fr", string>;
34
- gridColumn: Record<"auto" | "span-1" | "span-2" | "span-3" | "span-4" | "span-5" | "span-6" | "span-7" | "span-8" | "span-9" | "span-10" | "span-11" | "span-12" | "span-full", string>;
35
- gridColumnEnd: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "13" | "auto", string>;
36
- gridColumnStart: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "13" | "auto", string>;
37
- gridRow: Record<"auto" | "span-1" | "span-2" | "span-3" | "span-4" | "span-5" | "span-6" | "span-full", string>;
38
- gridRowEnd: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "auto", string>;
39
- gridRowStart: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "auto", string>;
40
- gridTemplateColumns: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "none", string>;
41
- gridTemplateRows: Record<"1" | "2" | "3" | "4" | "5" | "6" | "none", string>;
42
- hueRotate: Record<"0" | "15" | "30" | "60" | "90" | "180", string>;
43
- invert: Record<"0" | "DEFAULT", string>;
44
- letterSpacing: Record<"tighter" | "tight" | "normal" | "wide" | "wider" | "widest", string>;
45
- lineHeight: Record<"3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "none" | "tight" | "snug" | "normal" | "relaxed" | "loose", string>;
46
- listStyleType: Record<"none" | "disc" | "decimal", string>;
47
- listStyleImage: Record<"none", string>;
48
- lineClamp: Record<"1" | "2" | "3" | "4" | "5" | "6", string>;
49
- minHeight: Record<"0" | "full" | "screen" | "min" | "max" | "fit", string>;
50
- minWidth: Record<"0" | "full" | "min" | "max" | "fit", string>;
51
- objectPosition: Record<"bottom" | "center" | "left" | "left-bottom" | "left-top" | "right" | "right-bottom" | "right-top" | "top", string>;
52
- opacity: Record<"0" | "5" | "10" | "20" | "25" | "30" | "40" | "50" | "60" | "70" | "75" | "80" | "90" | "95" | "100", string>;
53
- order: Record<"1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "first" | "last" | "none", string>;
54
- outlineOffset: Record<"0" | "1" | "2" | "4" | "8", string>;
55
- outlineWidth: Record<"0" | "1" | "2" | "4" | "8", string>;
56
- ringOffsetWidth: Record<"0" | "1" | "2" | "4" | "8", string>;
57
- ringWidth: Record<"0" | "1" | "2" | "4" | "8" | "DEFAULT", string>;
58
- rotate: Record<"0" | "1" | "2" | "3" | "6" | "12" | "45" | "90" | "180", string>;
59
- saturate: Record<"0" | "50" | "100" | "150" | "200", string>;
60
- scale: Record<"0" | "50" | "75" | "90" | "95" | "100" | "105" | "110" | "125" | "150", string>;
61
- screens: Record<"sm" | "md" | "lg" | "xl" | "2xl", string>;
62
- sepia: Record<"0" | "DEFAULT", string>;
63
- skew: Record<"0" | "1" | "2" | "3" | "6" | "12", string>;
64
- spacing: Record<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | "px" | "0.5" | "1.5" | "2.5" | "3.5", string>;
65
- strokeWidth: Record<"0" | "1" | "2", string>;
66
- textDecorationThickness: Record<"0" | "1" | "2" | "4" | "8" | "auto" | "from-font", string>;
67
- textUnderlineOffset: Record<"0" | "1" | "2" | "4" | "8" | "auto", string>;
68
- transformOrigin: Record<"center" | "top" | "top-right" | "right" | "bottom-right" | "bottom" | "bottom-left" | "left" | "top-left", string>;
69
- transitionDelay: Record<"0" | "75" | "100" | "150" | "200" | "300" | "500" | "700" | "1000", string>;
70
- transitionDuration: Record<"0" | "75" | "100" | "150" | "200" | "300" | "500" | "700" | "1000" | "DEFAULT", string>;
71
- transitionProperty: Record<"none" | "all" | "DEFAULT" | "colors" | "opacity" | "shadow" | "transform", string>;
72
- transitionTimingFunction: Record<"DEFAULT" | "linear" | "in" | "out" | "in-out", string>;
73
- willChange: Record<"auto" | "scroll" | "contents" | "transform", string>;
74
- zIndex: Record<"0" | "10" | "20" | "30" | "40" | "50" | "auto", string>;
75
- };
76
- export type EvaluatedDefaultTheme = DefaultTheme & {
77
- padding: DefaultTheme["spacing"];
78
- colors: typeof colors;
79
- inset: DefaultTheme["spacing"] & Record<"full", string>;
80
- width: DefaultTheme["spacing"] & Record<"full" | "max", string>;
81
- height: DefaultTheme["spacing"] & Record<"max", string>;
82
- margin: DefaultTheme["spacing"] & Record<"auto", string>;
83
- maxWidth: DefaultTheme["spacing"] & Record<"none" | "0" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full" | "min" | "max" | "fit" | "prose", string>;
84
- };
85
- export {};
@@ -1,72 +0,0 @@
1
- import type { EvaluatedDefaultTheme } from "./radix-common-types";
2
- export declare const theme: <T extends "height" | "maxWidth" | "width" | "inset" | "colors" | "margin" | "padding" | keyof {
3
- animation: Record<"none" | "spin" | "ping" | "pulse" | "bounce", string>;
4
- aria: Record<"hidden" | "expanded" | "required" | "disabled" | "busy" | "checked" | "pressed" | "readonly" | "selected", string>;
5
- aspectRatio: Record<"auto" | "video" | "square", string>;
6
- backgroundImage: Record<"none" | "gradient-to-t" | "gradient-to-tr" | "gradient-to-r" | "gradient-to-br" | "gradient-to-b" | "gradient-to-bl" | "gradient-to-l" | "gradient-to-tl", string>;
7
- backgroundPosition: Record<"top" | "center" | "right" | "bottom" | "left" | "left-bottom" | "left-top" | "right-bottom" | "right-top", string>;
8
- backgroundSize: Record<"auto" | "contain" | "cover", string>;
9
- blur: Record<"none" | "0" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "3xl", string>;
10
- borderRadius: Record<"none" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full", string>;
11
- borderWidth: Record<"0" | "2" | "4" | "8" | "DEFAULT", string>;
12
- boxShadow: Record<"none" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl" | "inner", string>;
13
- brightness: Record<"0" | "100" | "200" | "50" | "75" | "90" | "95" | "105" | "110" | "125" | "150", string>;
14
- columns: Record<"auto" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "2xs" | "xs" | "4xl" | "5xl" | "6xl" | "7xl", string>;
15
- content: Record<"none", string>;
16
- contrast: Record<"0" | "100" | "200" | "50" | "75" | "125" | "150", string>;
17
- cursor: Record<"auto" | "none" | "progress" | "pointer" | "default" | "text" | "context-menu" | "help" | "wait" | "cell" | "crosshair" | "vertical-text" | "alias" | "copy" | "move" | "no-drop" | "not-allowed" | "e-resize" | "n-resize" | "ne-resize" | "nw-resize" | "s-resize" | "se-resize" | "sw-resize" | "w-resize" | "ew-resize" | "ns-resize" | "nesw-resize" | "nwse-resize" | "col-resize" | "row-resize" | "all-scroll" | "zoom-in" | "zoom-out" | "grab" | "grabbing", string>;
18
- dropShadow: Record<"none" | "sm" | "DEFAULT" | "md" | "lg" | "xl" | "2xl", string | string[]>;
19
- flex: Record<"auto" | "none" | "1" | "initial", string>;
20
- flexGrow: Record<"0" | "DEFAULT", string>;
21
- flexShrink: Record<"0" | "DEFAULT", string>;
22
- fontFamily: Record<"serif" | "sans" | "mono", string[]>;
23
- fontSize: Record<"base" | "sm" | "lg" | "xl" | "2xl" | "3xl" | "xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl", [string, {
24
- lineHeight: string;
25
- }]>;
26
- fontWeight: Record<"normal" | "medium" | "black" | "bold" | "thin" | "light" | "extralight" | "semibold" | "extrabold", string>;
27
- gradientColorStopPositions: Record<"0%" | "5%" | "10%" | "15%" | "20%" | "25%" | "30%" | "35%" | "40%" | "45%" | "50%" | "55%" | "60%" | "65%" | "70%" | "75%" | "80%" | "85%" | "90%" | "95%" | "100%", string>;
28
- grayscale: Record<"0" | "DEFAULT", string>;
29
- gridAutoColumns: Record<"fr" | "auto" | "min" | "max", string>;
30
- gridAutoRows: Record<"fr" | "auto" | "min" | "max", string>;
31
- gridColumn: Record<"auto" | "span-1" | "span-2" | "span-3" | "span-4" | "span-5" | "span-6" | "span-7" | "span-8" | "span-9" | "span-10" | "span-11" | "span-12" | "span-full", string>;
32
- gridColumnEnd: Record<"auto" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "13", string>;
33
- gridColumnStart: Record<"auto" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "13", string>;
34
- gridRow: Record<"auto" | "span-1" | "span-2" | "span-3" | "span-4" | "span-5" | "span-6" | "span-full", string>;
35
- gridRowEnd: Record<"auto" | "1" | "2" | "3" | "4" | "5" | "6" | "7", string>;
36
- gridRowStart: Record<"auto" | "1" | "2" | "3" | "4" | "5" | "6" | "7", string>;
37
- gridTemplateColumns: Record<"none" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12", string>;
38
- gridTemplateRows: Record<"none" | "1" | "2" | "3" | "4" | "5" | "6", string>;
39
- hueRotate: Record<"0" | "15" | "90" | "30" | "60" | "180", string>;
40
- invert: Record<"0" | "DEFAULT", string>;
41
- letterSpacing: Record<"normal" | "tighter" | "tight" | "wide" | "wider" | "widest", string>;
42
- lineHeight: Record<"normal" | "none" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "loose" | "tight" | "snug" | "relaxed", string>;
43
- listStyleType: Record<"none" | "disc" | "decimal", string>;
44
- listStyleImage: Record<"none", string>;
45
- lineClamp: Record<"1" | "2" | "3" | "4" | "5" | "6", string>;
46
- minHeight: Record<"0" | "screen" | "min" | "max" | "full" | "fit", string>;
47
- minWidth: Record<"0" | "min" | "max" | "full" | "fit", string>;
48
- objectPosition: Record<"top" | "center" | "right" | "bottom" | "left" | "left-bottom" | "left-top" | "right-bottom" | "right-top", string>;
49
- opacity: Record<"0" | "5" | "10" | "100" | "50" | "75" | "90" | "95" | "30" | "60" | "20" | "25" | "40" | "70" | "80", string>;
50
- order: Record<"none" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "first" | "last", string>;
51
- outlineOffset: Record<"0" | "1" | "2" | "4" | "8", string>;
52
- outlineWidth: Record<"0" | "1" | "2" | "4" | "8", string>;
53
- ringOffsetWidth: Record<"0" | "1" | "2" | "4" | "8", string>;
54
- ringWidth: Record<"0" | "1" | "2" | "4" | "8" | "DEFAULT", string>;
55
- rotate: Record<"0" | "1" | "2" | "3" | "6" | "12" | "90" | "180" | "45", string>;
56
- saturate: Record<"0" | "100" | "200" | "50" | "150", string>;
57
- scale: Record<"0" | "100" | "50" | "75" | "90" | "95" | "105" | "110" | "125" | "150", string>;
58
- screens: Record<"sm" | "md" | "lg" | "xl" | "2xl", string>;
59
- sepia: Record<"0" | "DEFAULT", string>;
60
- skew: Record<"0" | "1" | "2" | "3" | "6" | "12", string>;
61
- spacing: Record<"px" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "60" | "20" | "40" | "80" | "24" | "28" | "32" | "36" | "44" | "48" | "52" | "56" | "64" | "72" | "96" | "0.5" | "1.5" | "2.5" | "3.5", string>;
62
- strokeWidth: Record<"0" | "1" | "2", string>;
63
- textDecorationThickness: Record<"auto" | "0" | "1" | "2" | "4" | "8" | "from-font", string>;
64
- textUnderlineOffset: Record<"auto" | "0" | "1" | "2" | "4" | "8", string>;
65
- transformOrigin: Record<"top" | "center" | "right" | "bottom" | "left" | "top-right" | "bottom-right" | "bottom-left" | "top-left", string>;
66
- transitionDelay: Record<"0" | "100" | "200" | "300" | "500" | "700" | "75" | "150" | "1000", string>;
67
- transitionDuration: Record<"0" | "100" | "200" | "300" | "500" | "700" | "DEFAULT" | "75" | "150" | "1000", string>;
68
- transitionProperty: Record<"none" | "all" | "opacity" | "transform" | "DEFAULT" | "colors" | "shadow", string>;
69
- transitionTimingFunction: Record<"in" | "linear" | "DEFAULT" | "out" | "in-out", string>;
70
- willChange: Record<"auto" | "scroll" | "transform" | "contents", string>;
71
- zIndex: Record<"auto" | "0" | "10" | "50" | "30" | "20" | "40", string>;
72
- }>(name: T) => EvaluatedDefaultTheme[T];