@react-ui-org/react-ui 0.47.0 → 0.49.0

package/src/lib/theme.scss

@@ -196,13 +196,6 @@
     --rui-FormLayout--horizontal__label__width--auto: auto;
     --rui-FormLayout--horizontal__label__width--limited: fit-content(50%);
 
-    //
-    // Grid
-    // ====
-
-    --rui-Grid__column-gap: var(--rui-spacing-4);
-    --rui-Grid__row-gap: var(--rui-spacing-4);
-
     //
     // Toolbar
     // =======
@@ -850,24 +843,21 @@
     --rui-FormField--check--checked__border-color: var(--rui-color-active);
     --rui-FormField--check--checked__check-background-color: var(--rui-color-active);
 
-    //
-    // TextLink
-    // ========
-
-    --rui-TextLink__color: var(--rui-link-color);
-    --rui-TextLink__text-decoration: var(--rui-link-decoration);
-    --rui-TextLink--hover__color: var(--rui-link-hover-color);
-    --rui-TextLink--hover__text-decoration: var(--rui-link-hover-decoration);
-
     //
     // Modal
     // =====
 
+    --rui-Modal__padding-x: var(--rui-spacing-4);
+    --rui-Modal__padding-y: var(--rui-spacing-4);
     --rui-Modal__background: var(--rui-color-white);
-    --rui-Modal__box-shadow: var(--rui-elevation-2);
+    --rui-Modal__box-shadow: none;
+    --rui-Modal__separator__width: var(--rui-border-width);
+    --rui-Modal__separator__color: var(--rui-color-gray-100);
+    --rui-Modal__header__gap: var(--rui-spacing-2);
     --rui-Modal__outer-spacing--xs: var(--rui-spacing-2);
     --rui-Modal__outer-spacing--sm: var(--rui-spacing-6);
-    --rui-Modal__footer__background: var(--rui-color-gray-100);
+    --rui-Modal__footer__background: var(--rui-color-white);
+    --rui-Modal__footer__gap: var(--rui-spacing-2);
     --rui-Modal__backdrop__background: rgb(0 0 0 / 50%);
     --rui-Modal--auto__min-width: 18rem;
     --rui-Modal--auto__max-width: 60rem;
@@ -894,7 +884,7 @@
     // Popover
     // =======
 
-    --rui-Popover__width: 15rem;
+    --rui-Popover__max-width: 15rem;
     --rui-Popover__padding: var(--rui-spacing-3);
     --rui-Popover__border-width: 0;
     --rui-Popover__border-color: transparent;
@@ -903,13 +893,6 @@
     --rui-Popover__background-color: var(--rui-color-white);
     --rui-Popover__box-shadow: var(--rui-elevation-2);
 
-    //
-    // ScrollView
-    // ==========
-
-    --rui-ScrollView__arrow__initial-offset: -0.5rem;
-    --rui-ScrollView__shadow__initial-offset: -1rem;
-
     //
     // Tabs
     // ====
@@ -961,4 +944,13 @@
     --rui-Tabs__item--active__box-shadow: var(--rui-Tabs__item__box-shadow);
     --rui-Tabs__item--active__shift-y: -0.25em;
     --rui-Tabs__item--active__label__shift-y: 0;
+
+    //
+    // TextLink
+    // ========
+
+    --rui-TextLink__color: var(--rui-link-color);
+    --rui-TextLink__text-decoration: var(--rui-link-decoration);
+    --rui-TextLink--hover__color: var(--rui-link-hover-color);
+    --rui-TextLink--hover__text-decoration: var(--rui-link-hover-decoration);
 }

package/src/lib/translations/en.js

@@ -2,7 +2,7 @@ export default {
   Alert: {
     close: 'Close',
   },
-  Modal: {
+  ModalCloseButton: {
     close: 'Close',
   },
   ScrollView: {

package/src/lib/components/Grid/_theme.scss

@@ -1,11 +0,0 @@
-$responsive-properties: (
-    columns: 1fr,
-    column-gap: var(--rui-Grid__column-gap),
-    rows: auto,
-    row-gap: var(--rui-Grid__row-gap),
-    auto-flow: initial,
-    align-content: initial,
-    align-items: initial,
-    justify-content: initial,
-    justify-items: initial,
-);

package/src/lib/components/ScrollView/_theme.scss

@@ -1,2 +0,0 @@
-$arrow-initial-offset: var(--rui-ScrollView__arrow__initial-offset);
-$shadow-initial-offset: var(--rui-ScrollView__shadow__initial-offset);

package/src/lib/components/withForwardedRef.jsx

@@ -1,11 +0,0 @@
-import React from 'react';
-
-export default (WrappedComponent) => {
-  const withForwardedRef = (props, ref) => (
-    <WrappedComponent {...props} forwardedRef={ref} />
-  );
-
-  withForwardedRef.displayName = `withForwardedRef(${WrappedComponent.name || WrappedComponent.name})`;
-
-  return React.forwardRef(withForwardedRef);
-};