@basic-ui/material 1.0.0-alpha.27 → 1.0.0-alpha.29

package/build/cjs/index.js

@@ -55,6 +55,7 @@ const theme = {
     surface: '#fcfcfc',
     'surface-variant': '#efdee5',
     outline: '#81747a',
+    'outline-variant': '#d3c2c9',
     on: {
       primary: '#ffffff',
       secondary: '#ffffff',
@@ -67,7 +68,8 @@ const theme = {
       background: '#1f1a1c',
       surface: '#1f1a1c',
       'surface-variant': '#4f4349',
-      outline: '#feecf3'
+      outline: '#feecf3',
+      'outline-variant': '#22191e'
     },
     modes: {
       dark: {
@@ -83,6 +85,7 @@ const theme = {
         surface: '#1f1a1c',
         'surface-variant': '#4f4349',
         outline: '#9b8d93',
+        'outline-variant': '#4f4349',
         on: {
           primary: '#5b0e47',
           secondary: '#402a37',
@@ -95,7 +98,8 @@ const theme = {
           background: '#eae0e3',
           surface: '#eae0e3',
           'surface-variant': '#d3c2c9',
-          outline: '#22191e'
+          outline: '#22191e',
+          'outline-variant': '#efdee5'
         }
       }
     }
@@ -3511,13 +3515,13 @@ const Divider = /*#__PURE__*/react$1.forwardRef(function Divider(props, forwarde
         height: 0,
         borderBottomWidth: "0.0625rem",
         borderBottomStyle: 'solid',
-        borderBottomColor: 'outline'
+        borderBottomColor: 'outline-variant'
       }),
       ...(direction === 'vertical' && {
         width: 0,
         borderRightWidth: "0.0625rem",
         borderRightStyle: 'solid',
-        borderRightColor: 'outline'
+        borderRightColor: 'outline-variant'
       }),
       ...__css
     }
@@ -4852,15 +4856,11 @@ const StackProvider = ({
   maxSize = 3
 }) => {
   const onAddItemRef = react$1.useRef(null);
-
-  function onAddItem(element) {
-    onAddItemRef.current?.(element);
-  }
-
+  const value = react$1.useMemo(() => ({
+    addItem: element => onAddItemRef.current?.(element)
+  }), []);
   return /*#__PURE__*/jsxRuntime.jsxs(StackContext.Provider, {
-    value: {
-      addItem: onAddItem
-    },
+    value: value,
     children: [children, /*#__PURE__*/jsxRuntime.jsx(StackContent, {
       gap: gap,
       placement: placement,