@opencode-ai/ui 0.0.0-dev-202608040714 → 0.0.0-dev-202608040739

package/dist/context/i18n.d.ts

@@ -13,7 +13,8 @@ export type UiI18n = {
 };
 export declare function pluralCategory(locale: string, count: number): UiPluralCategory;
 export declare function pluralKey(key: UiI18nPluralKey, category: UiPluralCategory): UiI18nPluralLookupKey;
-export declare function I18nProvider(props: ParentProps<{
+declare function UiI18nProvider(props: ParentProps<{
     value: UiI18n;
 }>): import("solid-js").JSX.Element;
+export { UiI18nProvider as I18nProvider };
 export declare function useI18n(): UiI18n;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/ui",
-  "version": "0.0.0-dev-202608040714",
+  "version": "0.0.0-dev-202608040739",
   "type": "module",
   "license": "MIT",
   "repository": {

package/src/components/icon.css

@@ -32,3 +32,8 @@
     height: auto;
   }
 }
+
+:dir(rtl) [data-component="icon"][data-directional] [data-slot="icon-svg"],
+:dir(rtl) [data-slot="menu-v2-item-chevron"] {
+  transform: scaleX(-1);
+}

package/src/components/icon.tsx

@@ -151,7 +151,11 @@ export function Icon(props: IconProps) {
   onMount(ensureSprite)
 
   return (
-    <div data-component="icon" data-size={local.size || "normal"}>
+    <div
+      data-component="icon"
+      data-size={local.size || "normal"}
+      data-directional={local.name === "chevron-left" || local.name === "chevron-right" ? true : undefined}
+    >
       <svg
         data-slot="icon-svg"
         classList={{

package/src/components/toast.css

@@ -1,7 +1,7 @@
 [data-component="toast-region"] {
   position: fixed;
   bottom: 48px;
-  right: 32px;
+  inset-inline-end: 32px;
   z-index: 1000;
   display: flex;
   flex-direction: column;

package/src/context/i18n.tsx

@@ -1,4 +1,5 @@
 import { createContext, useContext, type Accessor, type ParentProps } from "solid-js"
+import { I18nProvider } from "@kobalte/core/i18n"
 import { dict as en } from "../i18n/en"
 
 export type UiI18nKey = keyof typeof en
@@ -57,10 +58,16 @@ const fallback: UiI18n = {
 
 const Context = createContext<UiI18n>(fallback)
 
-export function I18nProvider(props: ParentProps<{ value: UiI18n }>) {
-  return <Context.Provider value={props.value}>{props.children}</Context.Provider>
+function UiI18nProvider(props: ParentProps<{ value: UiI18n }>) {
+  return (
+    <I18nProvider locale={props.value.locale()}>
+      <Context.Provider value={props.value}>{props.children}</Context.Provider>
+    </I18nProvider>
+  )
 }
 
+export { UiI18nProvider as I18nProvider }
+
 export function useI18n() {
   return useContext(Context)
 }

package/src/v2/components/toast-v2.tsx

@@ -1,4 +1,5 @@
 import { Toaster, toast, type ToasterProps } from "solid-sonner"
+import { isRTL } from "@kobalte/core/i18n"
 import type { ComponentProps, JSX } from "solid-js"
 import { createContext, onCleanup, onMount, splitProps, useContext } from "solid-js"
 import { Portal } from "solid-js/web"
@@ -46,8 +47,8 @@ function ToastV2Region(props: ToastV2RegionProps) {
   return (
     <Portal>
       <Toaster
-        position="bottom-right"
-        offset={{ right: 32, bottom: 48 }}
+        position={isRTL(i18n.locale()) ? "bottom-left" : "bottom-right"}
+        offset={isRTL(i18n.locale()) ? { left: 32, bottom: 48 } : { right: 32, bottom: 48 }}
         mobileOffset={16}
         gap={12}
         duration={5000}