@webstudio-is/sdk-components-react-radix 0.87.0 → 0.88.0

package/lib/theme/tailwind-classes.js

@@ -4,6 +4,18 @@ import {
   parseBoxShadow,
   StyleValue
 } from "@webstudio-is/css-data";
+const property = (property2, value) => {
+  if (value.startsWith("--")) {
+    return {
+      property: property2,
+      value: { type: "var", value: value.slice(2), fallbacks: [] }
+    };
+  }
+  return {
+    property: property2,
+    value: { type: "unparsed", value }
+  };
+};
 const preflight = () => {
   const borderColorValue = parseCssValue("color", theme("colors")["border"]);
   return [
@@ -140,11 +152,11 @@ const borderB = (borderWidthOrColor) => {
     }
   ];
 };
-const paddingProperty = (property) => (padding) => {
+const paddingProperty = (property2) => (padding) => {
   const key = `${padding}`;
   const valueString = theme("padding")?.[key] ?? "0";
-  const value = parseCssValue(property, valueString);
-  return [{ property, value }];
+  const value = parseCssValue(property2, valueString);
+  return [{ property: property2, value }];
 };
 const pt = (padding) => {
   return paddingProperty("paddingTop")(padding);
@@ -167,11 +179,11 @@ const py = (padding) => {
 const p = (padding) => {
   return [px(padding), py(padding)].flat();
 };
-const marginProperty = (property) => (margin) => {
+const marginProperty = (property2) => (margin) => {
   const key = `${margin}`;
   const valueString = theme("margin")?.[key] ?? "0";
-  const value = parseCssValue(property, valueString);
-  return [{ property, value }];
+  const value = parseCssValue(property2, valueString);
+  return [{ property: property2, value }];
 };
 const ml = (margin) => {
   return marginProperty("marginLeft")(margin);
@@ -239,11 +251,11 @@ const maxW = (spacing) => {
   const value = parseCssValue("width", valueString);
   return [{ property: "maxWidth", value }];
 };
-const positionStyle = (property, spacing) => {
+const positionStyle = (property2, spacing) => {
   const key = `${spacing}`;
-  const valueString = theme("spacing")?.[key] ?? "0";
-  const value = parseCssValue(property, valueString);
-  return { property, value };
+  const valueString = theme("inset")?.[key] ?? "0";
+  const value = parseCssValue(property2, valueString);
+  return { property: property2, value };
 };
 const top = (spacing) => [positionStyle("top", spacing)];
 const right = (spacing) => [positionStyle("right", spacing)];
@@ -255,6 +267,21 @@ const inset = (spacing) => [
   positionStyle("top", spacing),
   positionStyle("bottom", spacing)
 ];
+const aspect = (value) => {
+  let unparsed = value;
+  if (value === "square") {
+    unparsed = "1 / 1";
+  }
+  if (value === "video") {
+    unparsed = "16 / 9";
+  }
+  return [
+    {
+      property: "aspectRatio",
+      value: { type: "unparsed", value: unparsed }
+    }
+  ];
+};
 const backdropBlur = (blur) => {
   const valueString = theme("blur")[blur];
   const value = {
@@ -263,6 +290,22 @@ const backdropBlur = (blur) => {
   };
   return [{ property: "backdropFilter", value }];
 };
+const list = (listStyle) => {
+  const valueString = theme("listStyleType")[listStyle];
+  const value = parseCssValue("listStyleType", valueString);
+  return [{ property: "listStyleType", value }];
+};
+const select = (selectValue) => {
+  return [
+    {
+      property: "userSelect",
+      value: {
+        type: "keyword",
+        value: "none"
+      }
+    }
+  ];
+};
 const bg = (color, alpha) => {
   const value = parseCssValue("backgroundColor", theme("colors")[color]);
   if (alpha !== void 0 && value.type === "rgb") {
@@ -334,6 +377,9 @@ const inlineFlex = () => {
     { property: "display", value: { type: "keyword", value: "inline-flex" } }
   ];
 };
+const block = () => {
+  return [{ property: "display", value: { type: "keyword", value: "block" } }];
+};
 const flexDirection = { row: "row", col: "column" };
 const flex = (flexParam) => {
   if (flexParam === void 0) {
@@ -417,11 +463,15 @@ const grow = () => {
   return [
     {
       property: "flexGrow",
-      value: {
-        type: "unit",
-        value: 1,
-        unit: "number"
-      }
+      value: { type: "unit", value: 1, unit: "number" }
+    }
+  ];
+};
+const shrink = (value) => {
+  return [
+    {
+      property: "flexGrow",
+      value: { type: "unit", value, unit: "number" }
     }
   ];
 };
@@ -434,6 +484,40 @@ const gap = (gapValue) => {
     { property: "columnGap", value }
   ];
 };
+const lineClamp = (lineClampValue) => {
+  const key = `${lineClampValue}`;
+  const valueString = theme("lineClamp")?.[key];
+  return [
+    {
+      property: "overflow",
+      value: {
+        type: "keyword",
+        value: "hidden"
+      }
+    },
+    {
+      property: "display",
+      value: {
+        type: "keyword",
+        value: "-webkit-box"
+      }
+    },
+    {
+      property: "-webkit-box-orient",
+      value: {
+        type: "keyword",
+        value: "vertical"
+      }
+    },
+    {
+      property: "-webkit-line-clamp",
+      value: {
+        type: "keyword",
+        value: valueString
+      }
+    }
+  ];
+};
 const leading = (lineHeight) => {
   const key = `${lineHeight}`;
   const valueString = theme("lineHeight")[key];
@@ -501,6 +585,14 @@ const text = (sizeOrColor) => {
     }
   ];
 };
+const noUnderline = () => {
+  return [
+    {
+      property: "textDecorationLine",
+      value: { type: "keyword", value: "none" }
+    }
+  ];
+};
 const underline = () => {
   return [
     {
@@ -589,7 +681,7 @@ const transition = (value) => {
   return [
     {
       property: "transitionProperty",
-      value: { type: "keyword", value: "all" }
+      value: { type: "keyword", value }
     },
     {
       property: "transitionTimingFunction",
@@ -601,6 +693,14 @@ const transition = (value) => {
     }
   ];
 };
+const duration = (ms) => {
+  return [
+    {
+      property: "transitionDuration",
+      value: { type: "unit", value: ms, unit: "ms" }
+    }
+  ];
+};
 const hover = (value) => {
   return value.map((decl) => ({
     ...decl,
@@ -633,13 +733,16 @@ const state = (value, state2) => {
 };
 export {
   absolute,
+  aspect,
   backdropBlur,
   bg,
+  block,
   border,
   borderB,
   bottom,
   cursor,
   disabled,
+  duration,
   fixed,
   flex,
   focus,
@@ -656,6 +759,8 @@ export {
   justify,
   leading,
   left,
+  lineClamp,
+  list,
   m,
   maxW,
   mb,
@@ -665,6 +770,7 @@ export {
   mt,
   mx,
   my,
+  noUnderline,
   opacity,
   outline,
   overflow,
@@ -673,6 +779,7 @@ export {
   pl,
   pointerEvents,
   pr,
+  property,
   pt,
   px,
   py,
@@ -680,7 +787,9 @@ export {
   right,
   ring,
   rounded,
+  select,
   shadow,
+  shrink,
   state,
   text,
   top,

package/lib/theme/tailwind-colors.js

@@ -1,6 +1,7 @@
 const colors = {
   transparent: "transparent",
   current: "currentColor",
+  inherit: "inherit",
   popover: "rgb(255, 255, 255)",
   popoverForeground: "rgb(2, 8, 23)",
   border: "rgb(226, 232, 240)",

package/lib/tooltip.ws.js

@@ -1,14 +1,14 @@
 import { TooltipIcon, TriggerIcon, ContentIcon } from "@webstudio-is/icons/svg";
 import {
 } from "@webstudio-is/react-sdk";
+import { div } from "@webstudio-is/react-sdk/css-normalize";
 import * as tc from "./theme/tailwind-classes";
 import {
   propsTooltip,
   propsTooltipContent,
   propsTooltipTrigger
 } from "./__generated__/tooltip.props";
-import { div } from "@webstudio-is/react-sdk/css-normalize";
-import { template as buttonTemplate } from "./button.ws";
+import { getButtonStyles } from "./theme/styles";
 const presetStyle = {
   div
 };
@@ -28,9 +28,9 @@ const metaTooltipContent = {
 };
 const metaTooltip = {
   category: "radix",
+  order: 7,
   type: "container",
   icon: TooltipIcon,
-  order: 15,
   stylable: false,
   template: [
     {
@@ -57,15 +57,18 @@ const metaTooltip = {
         {
           type: "instance",
           component: "TooltipTrigger",
-          props: [],
-          children: buttonTemplate({
-            children: [{ type: "text", value: "Button" }]
-          })
+          children: [
+            {
+              type: "instance",
+              component: "Button",
+              styles: getButtonStyles("outline"),
+              children: [{ type: "text", value: "Button" }]
+            }
+          ]
         },
         {
           type: "instance",
           component: "TooltipContent",
-          props: [],
           /**
            *  z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md
            **/

package/lib/types/__generated__/checkbox.props.d.ts

@@ -0,0 +1,3 @@
+import type { PropMeta } from "@webstudio-is/generate-arg-types";
+export declare const propsCheckbox: Record<string, PropMeta>;
+export declare const propsCheckboxIndicator: Record<string, PropMeta>;

package/lib/types/__generated__/navigation-menu.props.d.ts

@@ -0,0 +1,8 @@
+import type { PropMeta } from "@webstudio-is/generate-arg-types";
+export declare const propsNavigationMenu: Record<string, PropMeta>;
+export declare const propsNavigationMenuList: Record<string, PropMeta>;
+export declare const propsNavigationMenuViewport: Record<string, PropMeta>;
+export declare const propsNavigationMenuContent: Record<string, PropMeta>;
+export declare const propsNavigationMenuItem: Record<string, PropMeta>;
+export declare const propsNavigationMenuLink: Record<string, PropMeta>;
+export declare const propsNavigationMenuTrigger: Record<string, PropMeta>;

package/lib/types/__generated__/radio-group.props.d.ts

@@ -0,0 +1,4 @@
+import type { PropMeta } from "@webstudio-is/generate-arg-types";
+export declare const propsRadioGroup: Record<string, PropMeta>;
+export declare const propsRadioGroupItem: Record<string, PropMeta>;
+export declare const propsRadioGroupIndicator: Record<string, PropMeta>;

package/lib/types/__generated__/select.props.d.ts

@@ -0,0 +1,9 @@
+import type { PropMeta } from "@webstudio-is/generate-arg-types";
+export declare const propsSelect: Record<string, PropMeta>;
+export declare const propsSelectTrigger: Record<string, PropMeta>;
+export declare const propsSelectValue: Record<string, PropMeta>;
+export declare const propsSelectContent: Record<string, PropMeta>;
+export declare const propsSelectViewport: Record<string, PropMeta>;
+export declare const propsSelectItem: Record<string, PropMeta>;
+export declare const propsSelectItemIndicator: Record<string, PropMeta>;
+export declare const propsSelectItemText: Record<string, PropMeta>;

package/lib/types/__generated__/switch.props.d.ts

@@ -0,0 +1,3 @@
+import type { PropMeta } from "@webstudio-is/generate-arg-types";
+export declare const propsSwitch: Record<string, PropMeta>;
+export declare const propsSwitchThumb: Record<string, PropMeta>;

package/lib/types/checkbox.d.ts

@@ -0,0 +1,6 @@
+import { type ForwardRefExoticComponent, type ComponentPropsWithRef } from "react";
+import { Indicator } from "@radix-ui/react-checkbox";
+export declare const Checkbox: ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-checkbox").CheckboxProps & import("react").RefAttributes<HTMLButtonElement>, "checked"> & {
+    checked: boolean;
+}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const CheckboxIndicator: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Indicator>>;

package/lib/types/checkbox.stories.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import type { StoryObj } from "@storybook/react";
+import { Checkbox as CheckboxPrimitive } from "./checkbox";
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-checkbox").CheckboxProps & import("react").RefAttributes<HTMLButtonElement>, "checked"> & {
+        checked: boolean;
+    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export default _default;
+export declare const Checkbox: StoryObj<typeof CheckboxPrimitive>;

package/lib/types/checkbox.ws.d.ts

@@ -0,0 +1,5 @@
+import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/react-sdk";
+export declare const metaCheckbox: WsComponentMeta;
+export declare const metaCheckboxIndicator: WsComponentMeta;
+export declare const propsMetaCheckbox: WsComponentPropsMeta;
+export declare const propsMetaCheckboxIndicator: WsComponentPropsMeta;

package/lib/types/components.d.ts

@@ -2,10 +2,11 @@ export { Collapsible, CollapsibleTrigger, CollapsibleContent, } from "./collapsi
 export { Dialog, DialogTrigger, DialogOverlay, DialogContent, DialogClose, DialogTitle, DialogDescription, } from "./dialog";
 export { Popover, PopoverTrigger, PopoverContent } from "./popover";
 export { Tooltip, TooltipTrigger, TooltipContent } from "./tooltip";
-export { Sheet, SheetTrigger, SheetOverlay, SheetContent, SheetClose, SheetTitle, SheetDescription, } from "./sheet";
 export { Tabs, TabsList, TabsTrigger, TabsContent } from "./tabs";
-export { Button } from "./button";
-export { Input } from "./input";
-export { Textarea } from "./textarea";
 export { Label } from "./label";
 export { Accordion, AccordionItem, AccordionHeader, AccordionTrigger, AccordionContent, } from "./accordion";
+export { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink, NavigationMenuViewport, } from "./navigation-menu";
+export { Select, SelectTrigger, SelectValue, SelectViewport, SelectContent, SelectItem, SelectItemIndicator, SelectItemText, } from "./select";
+export { Switch, SwitchThumb } from "./switch";
+export { Checkbox, CheckboxIndicator } from "./checkbox";
+export { RadioGroup, RadioGroupItem, RadioGroupIndicator } from "./radio-group";

package/lib/types/metas.d.ts

@@ -1,11 +1,13 @@
 export { metaCollapsible as Collapsible, metaCollapsibleTrigger as CollapsibleTrigger, metaCollapsibleContent as CollapsibleContent, } from "./collapsible.ws";
 export { metaDialog as Dialog, metaDialogTrigger as DialogTrigger, metaDialogOverlay as DialogOverlay, metaDialogContent as DialogContent, metaDialogClose as DialogClose, metaDialogTitle as DialogTitle, metaDialogDescription as DialogDescription, } from "./dialog.ws";
+export { meta as Sheet } from "./sheet.ws";
 export { metaPopover as Popover, metaPopoverTrigger as PopoverTrigger, metaPopoverContent as PopoverContent, } from "./popover.ws";
 export { metaTooltip as Tooltip, metaTooltipTrigger as TooltipTrigger, metaTooltipContent as TooltipContent, } from "./tooltip.ws";
-export { metaSheet as Sheet, metaSheetTrigger as SheetTrigger, metaSheetOverlay as SheetOverlay, metaSheetContent as SheetContent, metaSheetClose as SheetClose, metaSheetTitle as SheetTitle, metaSheetDescription as SheetDescription, } from "./sheet.ws";
 export { metaTabs as Tabs, metaTabsList as TabsList, metaTabsTrigger as TabsTrigger, metaTabsContent as TabsContent, } from "./tabs.ws";
-export { meta as Button } from "./button.ws";
-export { meta as Input } from "./input.ws";
-export { meta as Textarea } from "./textarea.ws";
 export { meta as Label } from "./label.ws";
 export { metaAccordion as Accordion, metaAccordionItem as AccordionItem, metaAccordionHeader as AccordionHeader, metaAccordionTrigger as AccordionTrigger, metaAccordionContent as AccordionContent, } from "./accordion.ws";
+export { metaNavigationMenu as NavigationMenu, metaNavigationMenuList as NavigationMenuList, metaNavigationMenuItem as NavigationMenuItem, metaNavigationMenuTrigger as NavigationMenuTrigger, metaNavigationMenuContent as NavigationMenuContent, metaNavigationMenuLink as NavigationMenuLink, metaNavigationMenuViewport as NavigationMenuViewport, } from "./navigation-menu.ws";
+export { metaSelect as Select, metaSelectTrigger as SelectTrigger, metaSelectValue as SelectValue, metaSelectViewport as SelectViewport, metaSelectContent as SelectContent, metaSelectItem as SelectItem, metaSelectItemIndicator as SelectItemIndicator, metaSelectItemText as SelectItemText, } from "./select.ws";
+export { metaSwitch as Switch, metaSwitchThumb as SwitchThumb, } from "./switch.ws";
+export { metaCheckbox as Checkbox, metaCheckboxIndicator as CheckboxIndicator, } from "./checkbox.ws";
+export { metaRadioGroup as RadioGroup, metaRadioGroupItem as RadioGroupItem, metaRadioGroupIndicator as RadioGroupIndicator, } from "./radio-group.ws";

package/lib/types/navigation-menu.d.ts

@@ -0,0 +1,15 @@
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
+import { type Hook } from "@webstudio-is/react-sdk";
+import { type ReactNode } from "react";
+export declare const NavigationMenu: import("react").ForwardRefExoticComponent<Omit<Omit<NavigationMenuPrimitive.NavigationMenuProps & import("react").RefAttributes<HTMLElement>, "ref">, "aria-orientation" | "orientation"> & import("react").RefAttributes<HTMLLIElement>>;
+export declare const NavigationMenuList: import("react").ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>;
+export declare const NavigationMenuViewport: import("react").ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuViewportProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuContent: import("react").ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuItem: import("react").ForwardRefExoticComponent<Omit<Omit<NavigationMenuPrimitive.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref">, "asChild"> & import("react").RefAttributes<HTMLLIElement>>;
+export declare const NavigationMenuLink: import("react").ForwardRefExoticComponent<{
+    children: ReactNode;
+} & import("react").RefAttributes<HTMLAnchorElement>>;
+export declare const NavigationMenuTrigger: import("react").ForwardRefExoticComponent<{
+    children: ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const hooksNavigationMenu: Hook;

package/lib/types/navigation-menu.ws.d.ts

@@ -0,0 +1,15 @@
+import type { WsComponentMeta, WsComponentPropsMeta } from "@webstudio-is/react-sdk";
+export declare const metaNavigationMenu: WsComponentMeta;
+export declare const metaNavigationMenuList: WsComponentMeta;
+export declare const metaNavigationMenuItem: WsComponentMeta;
+export declare const metaNavigationMenuTrigger: WsComponentMeta;
+export declare const metaNavigationMenuContent: WsComponentMeta;
+export declare const metaNavigationMenuLink: WsComponentMeta;
+export declare const metaNavigationMenuViewport: WsComponentMeta;
+export declare const propsMetaNavigationMenu: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuItem: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuTrigger: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuContent: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuLink: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuList: WsComponentPropsMeta;
+export declare const propsMetaNavigationMenuViewport: WsComponentPropsMeta;

package/lib/types/props.d.ts

@@ -2,10 +2,11 @@ export { propsMetaCollapsible as Collapsible, propsMetaCollapsibleTrigger as Col
 export { propsMetaDialog as Dialog, propsMetaDialogTrigger as DialogTrigger, propsMetaDialogOverlay as DialogOverlay, propsMetaDialogContent as DialogContent, propsMetaDialogClose as DialogClose, propsMetaDialogTitle as DialogTitle, propsMetaDialogDescription as DialogDescription, } from "./dialog.ws";
 export { propsMetaPopover as Popover, propsMetaPopoverTrigger as PopoverTrigger, propsMetaPopoverContent as PopoverContent, } from "./popover.ws";
 export { propsMetaTooltip as Tooltip, propsMetaTooltipTrigger as TooltipTrigger, propsMetaTooltipContent as TooltipContent, } from "./tooltip.ws";
-export { propsMetaSheet as Sheet, propsMetaSheetTrigger as SheetTrigger, propsMetaSheetOverlay as SheetOverlay, propsMetaSheetContent as SheetContent, propsMetaSheetClose as SheetClose, propsMetaSheetTitle as SheetTitle, propsMetaSheetDescription as SheetDescription, } from "./sheet.ws";
 export { propsMetaTabs as Tabs, propsMetaTabsList as TabsList, propsMetaTabsTrigger as TabsTrigger, propsMetaTabsContent as TabsContent, } from "./tabs.ws";
-export { propsMeta as Button } from "./button.ws";
-export { propsMeta as Input } from "./input.ws";
-export { propsMeta as Textarea } from "./textarea.ws";
 export { propsMeta as Label } from "./label.ws";
 export { propsMetaAccordion as Accordion, propsMetaAccordionItem as AccordionItem, propsMetaAccordionHeader as AccordionHeader, propsMetaAccordionTrigger as AccordionTrigger, propsMetaAccordionContent as AccordionContent, } from "./accordion.ws";
+export { propsMetaNavigationMenu as NavigationMenu, propsMetaNavigationMenuList as NavigationMenuList, propsMetaNavigationMenuItem as NavigationMenuItem, propsMetaNavigationMenuTrigger as NavigationMenuTrigger, propsMetaNavigationMenuContent as NavigationMenuContent, propsMetaNavigationMenuLink as NavigationMenuLink, propsMetaNavigationMenuViewport as NavigationMenuViewport, } from "./navigation-menu.ws";
+export { propsMetaSelect as Select, propsMetaSelectTrigger as SelectTrigger, propsMetaSelectValue as SelectValue, propsMetaSelectViewport as SelectViewport, propsMetaSelectContent as SelectContent, propsMetaSelectItem as SelectItem, propsMetaSelectItemIndicator as SelectItemIndicator, propsMetaSelectItemText as SelectItemText, } from "./select.ws";
+export { propsMetaSwitch as Switch, propsMetaSwitchThumb as SwitchThumb, } from "./switch.ws";
+export { propsMetaCheckbox as Checkbox, propsMetaCheckboxIndicator as CheckboxIndicator, } from "./checkbox.ws";
+export { propsMetaRadioGroup as RadioGroup, propsMetaRadioGroupItem as RadioGroupItem, propsMetaRadioGroupIndicator as RadioGroupIndicator, } from "./radio-group.ws";

package/lib/types/radio-group.d.ts

@@ -0,0 +1,5 @@
+import { type ForwardRefExoticComponent, type ComponentPropsWithRef } from "react";
+import { Root, Item, Indicator } from "@radix-ui/react-radio-group";
+export declare const RadioGroup: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Root>>;
+export declare const RadioGroupItem: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Item>>;
+export declare const RadioGroupIndicator: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Indicator>>;

package/lib/types/radio-group.stories.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { StoryObj } from "@storybook/react";
+import { RadioGroup as RadioGroupPrimitive } from "./radio-group";
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("@radix-ui/react-radio-group").RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+};
+export default _default;
+export declare const RadioGroup: StoryObj<typeof RadioGroupPrimitive>;

package/lib/types/radio-group.ws.d.ts

@@ -0,0 +1,7 @@
+import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/react-sdk";
+export declare const metaRadioGroup: WsComponentMeta;
+export declare const metaRadioGroupItem: WsComponentMeta;
+export declare const metaRadioGroupIndicator: WsComponentMeta;
+export declare const propsMetaRadioGroup: WsComponentPropsMeta;
+export declare const propsMetaRadioGroupItem: WsComponentPropsMeta;
+export declare const propsMetaRadioGroupIndicator: WsComponentPropsMeta;

package/lib/types/select.d.ts

@@ -0,0 +1,12 @@
+import { type ForwardRefExoticComponent, type ComponentPropsWithRef } from "react";
+import { Value, Trigger, Item, ItemIndicator, ItemText, Viewport } from "@radix-ui/react-select";
+import { type Hook } from "@webstudio-is/react-sdk";
+export declare const Select: ForwardRefExoticComponent<import("@radix-ui/react-select").SelectProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const SelectTrigger: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Trigger>>;
+export declare const SelectValue: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Value>>;
+export declare const SelectContent: ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-select").SelectContentProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "position" | "side"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const SelectViewport: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Viewport>>;
+export declare const SelectItem: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Item>>;
+export declare const SelectItemIndicator: ForwardRefExoticComponent<ComponentPropsWithRef<typeof ItemIndicator>>;
+export declare const SelectItemText: ForwardRefExoticComponent<ComponentPropsWithRef<typeof ItemText>>;
+export declare const hooksSelect: Hook;

package/lib/types/select.ws.d.ts

@@ -0,0 +1,17 @@
+import type { WsComponentMeta, WsComponentPropsMeta } from "@webstudio-is/react-sdk";
+export declare const metaSelect: WsComponentMeta;
+export declare const metaSelectTrigger: WsComponentMeta;
+export declare const metaSelectValue: WsComponentMeta;
+export declare const metaSelectContent: WsComponentMeta;
+export declare const metaSelectViewport: WsComponentMeta;
+export declare const metaSelectItem: WsComponentMeta;
+export declare const metaSelectItemIndicator: WsComponentMeta;
+export declare const metaSelectItemText: WsComponentMeta;
+export declare const propsMetaSelect: WsComponentPropsMeta;
+export declare const propsMetaSelectTrigger: WsComponentPropsMeta;
+export declare const propsMetaSelectValue: WsComponentPropsMeta;
+export declare const propsMetaSelectContent: WsComponentPropsMeta;
+export declare const propsMetaSelectViewport: WsComponentPropsMeta;
+export declare const propsMetaSelectItem: WsComponentPropsMeta;
+export declare const propsMetaSelectItemIndicator: WsComponentPropsMeta;
+export declare const propsMetaSelectItemText: WsComponentPropsMeta;

package/lib/types/sheet.ws.d.ts

@@ -1,10 +1,4 @@
-import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/react-sdk";
-export declare const metaSheetTrigger: WsComponentMeta;
-export declare const metaSheetContent: WsComponentMeta;
-export declare const metaSheetOverlay: WsComponentMeta;
-export declare const metaSheetTitle: WsComponentMeta;
-export declare const metaSheetDescription: WsComponentMeta;
-export declare const metaSheetClose: WsComponentMeta;
+import type { WsComponentMeta } from "@webstudio-is/react-sdk";
 /**
  * Styles source without animations:
  * https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/ui/sheet.tsx
@@ -13,11 +7,4 @@ export declare const metaSheetClose: WsComponentMeta;
  * MIT License
  * Copyright (c) 2023 shadcn
  **/
-export declare const metaSheet: WsComponentMeta;
-export declare const propsMetaSheet: WsComponentPropsMeta;
-export declare const propsMetaSheetTrigger: WsComponentPropsMeta;
-export declare const propsMetaSheetContent: WsComponentPropsMeta;
-export declare const propsMetaSheetOverlay: WsComponentPropsMeta;
-export declare const propsMetaSheetClose: WsComponentPropsMeta;
-export declare const propsMetaSheetTitle: WsComponentPropsMeta;
-export declare const propsMetaSheetDescription: WsComponentPropsMeta;
+export declare const meta: WsComponentMeta;

package/lib/types/switch.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, ComponentPropsWithRef } from "react";
+import { Root, Thumb } from "@radix-ui/react-switch";
+export declare const Switch: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Root>>;
+export declare const SwitchThumb: ForwardRefExoticComponent<ComponentPropsWithRef<typeof Thumb>>;

package/lib/types/switch.stories.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { StoryObj } from "@storybook/react";
+import { Switch as SwitchPrimitive } from "./switch";
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("@radix-ui/react-switch").SwitchProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export default _default;
+export declare const Switch: StoryObj<typeof SwitchPrimitive>;

package/lib/types/switch.ws.d.ts

@@ -0,0 +1,5 @@
+import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/react-sdk";
+export declare const metaSwitch: WsComponentMeta;
+export declare const metaSwitchThumb: WsComponentMeta;
+export declare const propsMetaSwitch: WsComponentPropsMeta;
+export declare const propsMetaSwitchThumb: WsComponentPropsMeta;

package/lib/types/tabs.d.ts

@@ -1,17 +1,8 @@
-import { type ForwardRefExoticComponent, type ComponentPropsWithRef, type ReactNode } from "react";
+import { type ForwardRefExoticComponent, type ComponentPropsWithRef } from "react";
 import { Root } from "@radix-ui/react-tabs";
 import { type Hook } from "@webstudio-is/react-sdk";
 export declare const Tabs: ForwardRefExoticComponent<Omit<ComponentPropsWithRef<typeof Root>, "asChild" | "defaultValue">>;
 export declare const TabsList: ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement>>;
-/**
- * We're not exposing the 'asChild' property for the Trigger.
- * Instead, we're enforcing 'asChild=true' for the Trigger and making it style-less.
- * This avoids situations where the Trigger inadvertently passes all styles to its child,
- * which would prevent us from displaying styles properly in the builder.
- */
-export declare const TabsTrigger: ForwardRefExoticComponent<{
-    value: string;
-    children: ReactNode;
-} & import("react").RefAttributes<HTMLButtonElement>>;
-export declare const TabsContent: ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "asChild"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabsTrigger: ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const TabsContent: ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export declare const hooksTabs: Hook;

package/lib/types/theme/radix-common-types.d.ts

@@ -76,8 +76,9 @@ type DefaultTheme = {
 export type EvaluatedDefaultTheme = DefaultTheme & {
     padding: DefaultTheme["spacing"];
     colors: typeof colors;
-    width: DefaultTheme["spacing"] & Record<"full", string>;
-    height: DefaultTheme["spacing"];
+    inset: DefaultTheme["spacing"] & Record<"full", string>;
+    width: DefaultTheme["spacing"] & Record<"full" | "max", string>;
+    height: DefaultTheme["spacing"] & Record<"max", string>;
     margin: DefaultTheme["spacing"] & Record<"auto", string>;
     maxWidth: DefaultTheme["spacing"] & Record<"none" | "0" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full" | "min" | "max" | "fit" | "prose", string>;
 };