@dxos/react-ui 0.6.13 → 0.6.14-main.2b6a0f3

package/dist/lib/browser/index.mjs

@@ -94,7 +94,8 @@ var useTranslationsContext = () => useContext4(TranslationsContext);
 
 // packages/ui/react-ui/src/hooks/useThemeContext.ts
 import { useContext as useContext5 } from "react";
-var useThemeContext = () => useContext5(ThemeContext);
+import { raise } from "@dxos/debug";
+var useThemeContext = () => useContext5(ThemeContext) ?? raise(new Error("Missing ThemeContext"));
 
 // packages/ui/react-ui/src/hooks/useVisualViewport.ts
 import { useEffect as useEffect2, useState as useState2 } from "react";
@@ -1142,7 +1143,7 @@ import { List as ListPrimitive, ListItemHeading as ListPrimitiveItemHeading, Lis
 // packages/ui/react-ui/src/components/DensityProvider/DensityProvider.tsx
 import React17, { createContext as createContext7 } from "react";
 var DensityContext = /* @__PURE__ */ createContext7({
-  density: "coarse"
+  density: "fine"
 });
 var DensityProvider = ({ density, children }) => /* @__PURE__ */ React17.createElement(DensityContext.Provider, {
   value: {
@@ -1950,7 +1951,7 @@ var ScrollArea = {
 };
 
 // packages/ui/react-ui/src/components/Select/Select.tsx
-import { CaretDown as CaretDown2, CaretUp, Check as Check2 } from "@phosphor-icons/react";
+import { CaretDown as CaretDown2, CaretUp } from "@phosphor-icons/react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import React26, { forwardRef as forwardRef23 } from "react";
 var SelectRoot = SelectPrimitive.Root;
@@ -1965,20 +1966,21 @@ var SelectTriggerButton = /* @__PURE__ */ forwardRef23(({ children, placeholder,
     ref: forwardedRef
   }, /* @__PURE__ */ React26.createElement(Button, props, /* @__PURE__ */ React26.createElement(SelectPrimitive.Value, {
     placeholder
-  }, children), /* @__PURE__ */ React26.createElement(SelectPrimitive.Icon, {
+  }, children), /* @__PURE__ */ React26.createElement("span", {
+    className: "w-1 flex-1"
+  }), /* @__PURE__ */ React26.createElement(SelectPrimitive.Icon, {
     asChild: true
-  }, /* @__PURE__ */ React26.createElement(React26.Fragment, null, /* @__PURE__ */ React26.createElement("span", {
-    className: "w-1"
-  }), /* @__PURE__ */ React26.createElement(CaretDown2, {
+  }, /* @__PURE__ */ React26.createElement(CaretDown2, {
     className: tx("select.triggerIcon", "select__trigger__icon", {}),
     weight: "bold"
-  })))));
+  }))));
 });
 var SelectContent = /* @__PURE__ */ forwardRef23(({ classNames, children, ...props }, forwardedRef) => {
   const { tx } = useThemeContext();
   return /* @__PURE__ */ React26.createElement(SelectPrimitive.Content, {
     ...props,
     className: tx("select.content", "select__content", {}, classNames),
+    position: "popper",
     ref: forwardedRef
   }, children);
 });
@@ -2026,11 +2028,11 @@ var SelectOption = /* @__PURE__ */ forwardRef23(({ children, classNames, ...prop
     ...props,
     className: tx("select.item", "option", {}, classNames),
     ref: forwardedRef
-  }, /* @__PURE__ */ React26.createElement(SelectPrimitive.ItemText, null, children), /* @__PURE__ */ React26.createElement(SelectPrimitive.ItemIndicator, {
-    className: tx("select.itemIndicator", "option__indicator", {})
-  }, /* @__PURE__ */ React26.createElement(Check2, {
-    weight: "bold"
-  })));
+  }, /* @__PURE__ */ React26.createElement(SelectPrimitive.ItemText, null, children), /* @__PURE__ */ React26.createElement("span", {
+    className: "grow w-1"
+  }), /* @__PURE__ */ React26.createElement(Icon, {
+    icon: "ph--check--regular"
+  }));
 });
 var SelectGroup = SelectPrimitive.Group;
 var SelectLabel = SelectPrimitive.Label;
@@ -2122,9 +2124,7 @@ var ToastRoot = /* @__PURE__ */ forwardRef25(({ classNames, children, ...props }
     ref: forwardedRef
   }, /* @__PURE__ */ React29.createElement(ElevationProvider, {
     elevation: "chrome"
-  }, /* @__PURE__ */ React29.createElement(DensityProvider, {
-    density: "fine"
-  }, children)));
+  }, children));
 });
 var ToastBody = /* @__PURE__ */ forwardRef25(({ asChild, classNames, ...props }, forwardedRef) => {
   const { tx } = useThemeContext();
@@ -2195,6 +2195,14 @@ var ToolbarButton = /* @__PURE__ */ forwardRef26((props, forwardedRef) => {
     ref: forwardedRef
   }));
 });
+var ToolbarToggle = /* @__PURE__ */ forwardRef26((props, forwardedRef) => {
+  return /* @__PURE__ */ React30.createElement(ToolbarPrimitive.Button, {
+    asChild: true
+  }, /* @__PURE__ */ React30.createElement(Toggle, {
+    ...props,
+    ref: forwardedRef
+  }));
+});
 var ToolbarLink = /* @__PURE__ */ forwardRef26((props, forwardedRef) => {
   return /* @__PURE__ */ React30.createElement(ToolbarPrimitive.Link, {
     asChild: true
@@ -2239,6 +2247,7 @@ var Toolbar = {
   Root: ToolbarRoot,
   Button: ToolbarButton,
   Link: ToolbarLink,
+  Toggle: ToolbarToggle,
   ToggleGroup: ToolbarToggleGroup2,
   ToggleGroupItem: ToolbarToggleGroupItem,
   Separator: ToolbarSeparator
@@ -2288,19 +2297,8 @@ var hasIosKeyboard = () => {
 };
 
 // packages/ui/react-ui/src/components/ThemeProvider/ThemeProvider.tsx
-var ThemeContext = /* @__PURE__ */ createContext10({
-  tx: (_path, defaultClassName, _styleProps, ..._options) => defaultClassName,
-  themeMode: "dark",
-  hasIosKeyboard: false
-});
-var handleInputModalityChange = (isUsingKeyboard) => {
-  if (isUsingKeyboard) {
-    document.body.setAttribute("data-is-keyboard", "true");
-  } else {
-    document.body.removeAttribute("data-is-keyboard");
-  }
-};
-var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, defaultClassName, _styleProps, ..._options) => defaultClassName, themeMode = "dark", rootElevation = "base", rootDensity = "coarse" }) => {
+var ThemeContext = /* @__PURE__ */ createContext10(void 0);
+var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, defaultClassName, _styleProps, ..._options) => defaultClassName, themeMode = "dark", rootDensity = "fine", rootElevation = "base" }) => {
   useEffect5(() => {
     if (document.defaultView) {
       const kb = createKeyborg(document.defaultView);
@@ -2324,6 +2322,13 @@ var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx
     density: rootDensity
   }, children))));
 };
+var handleInputModalityChange = (isUsingKeyboard) => {
+  if (isUsingKeyboard) {
+    document.body.setAttribute("data-is-keyboard", "true");
+  } else {
+    document.body.removeAttribute("data-is-keyboard");
+  }
+};
 export {
   AlertDialog,
   AnchoredOverflow,