@obosbbl/grunnmuren-react 2.0.0-canary.26 → 2.0.0-canary.28

package/dist/index.mjs

@@ -286,7 +286,7 @@ const formField = cx('group flex flex-col gap-2');
 const formFieldError = cx('w-fit rounded-sm bg-red-light px-2 py-1 text-sm leading-6 text-red');
 const input = cva({
     base: [
-        'rounded-md py-2.5 text-sm font-normal leading-6 placeholder-[#727070] outline-none ring-1 ring-black',
+        'rounded-md py-2.5 text-base font-normal leading-6 placeholder-[#727070] outline-none ring-1 ring-black',
         // invalid styles
         'group-data-[invalid]:ring-2 group-data-[invalid]:ring-red',
         // Fix invisible ring on safari: https://github.com/tailwindlabs/tailwindcss.com/issues/1135
@@ -309,14 +309,12 @@ const input = cva({
     }
 });
 const inputGroup = cx([
-    'inline-flex items-center gap-3 overflow-hidden rounded-md bg-white px-3 text-sm ring-1 ring-black focus-within:ring-2',
-    'group-data-[invalid]:ring-2 group-data-[invalid]:ring-red group-data-[invalid]:focus-within:ring',
-    // Make sure icons are the correct size
-    '[&_svg]:text-base'
+    'inline-flex items-center gap-3 overflow-hidden rounded-md bg-white px-3 text-base ring-1 ring-black focus-within:ring-2',
+    'group-data-[invalid]:ring-2 group-data-[invalid]:ring-red group-data-[invalid]:focus-within:ring'
 ]);
 const dropdown = {
-    popover: cx('min-w-[--trigger-width] overflow-auto rounded-md border border-black bg-white shadow data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in data-[exiting]:fade-out'),
-    listbox: cx('text-sm outline-none'),
+    popover: cx('min-w-[--trigger-width] rounded-md bg-white shadow data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in data-[exiting]:fade-out'),
+    listbox: cx('max-h-[25rem] overflow-y-scroll rounded-md border border-black text-sm outline-none'),
     chevronIcon: cx('text-base transition-transform duration-150 group-data-[open]:rotate-180 motion-reduce:transition-none')
 };
 
@@ -330,11 +328,12 @@ function ErrorMessage(props) {
     });
 }
 
+const descriptionClasses = 'text-sm font-light leading-6';
 function Description(props) {
     const { className, ...restProps } = props;
     return /*#__PURE__*/ jsx(Text, {
         ...restProps,
-        className: cx(className, 'text-sm font-light leading-6'),
+        className: cx(className, descriptionClasses),
         slot: "description"
     });
 }
@@ -394,12 +393,12 @@ function Checkbox(props, ref) {
                         children
                     ]
                 }),
-                description && /*#__PURE__*/ jsx(Description, {
-                    className: "block",
-                    children: /*#__PURE__*/ jsx("div", {
-                        id: descriptionId,
-                        children: description
-                    })
+                description && // {/* Use a div instead of the Description component to avoid infinite re-render loops in React until this bug in RAC is fixed: https://github.com/adobe/react-spectrum/issues/6229 */}
+                /*#__PURE__*/ jsx("div", {
+                    id: descriptionId,
+                    slot: "description",
+                    className: cx('block', descriptionClasses),
+                    children: description
                 }),
                 errorMessage && /*#__PURE__*/ jsx(ErrorMessage, {
                     className: "mt-2 block",
@@ -533,6 +532,7 @@ function Combobox(props, ref) {
                 className: cx(dropdown.popover, 'min-w-[calc(var(--trigger-width)+26px)]'),
                 crossOffset: -13,
                 children: /*#__PURE__*/ jsx(ListBox, {
+                    className: dropdown.listbox,
                     children: children
                 })
             })
@@ -645,6 +645,7 @@ function Select(props, ref) {
             /*#__PURE__*/ jsx(Popover, {
                 className: dropdown.popover,
                 children: /*#__PURE__*/ jsx(ListBox, {
+                    className: dropdown.listbox,
                     children: children
                 })
             })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@obosbbl/grunnmuren-react",
-  "version": "2.0.0-canary.26",
+  "version": "2.0.0-canary.28",
   "description": "Grunnmuren components in React",
   "repository": {
     "url": "https://github.com/code-obos/grunnmuren"
@@ -19,10 +19,10 @@
   ],
   "dependencies": {
     "@obosbbl/grunnmuren-icons-react": "^2.0.0-canary.1",
-    "@react-aria/utils": "^3.23.2",
+    "@react-aria/utils": "^3.24.0",
     "@types/node": "^20.11.19",
     "cva": "1.0.0-beta.1",
-    "react-aria-components": "^1.1.1"
+    "react-aria-components": "^1.2.0"
   },
   "peerDependencies": {
     "react": "^18"