feat(Box): remove component

digdir · Sep 5, 2024 · 8a6fd1e · 8a6fd1e
1 parent 0703262
commit 8a6fd1e
Show file tree

Hide file tree

Showing 11 changed files with 8 additions and 255 deletions.
diff --git a/packages/css/box.css b/packages/css/box.css
diff --git a/packages/css/combobox.css b/packages/css/combobox.css
@@ -16,6 +16,8 @@
   overflow-y: auto;
   z-index: 1600;
   border-radius: min(1rem, var(--ds-border-radius-md));
+  box-shadow: var(--ds-shadow-md);
+  border: 1px solid var(--ds-color-neutral-border-default);
 }
 
 .ds-combobox--readonly .ds-combobox__input {

diff --git a/packages/css/index.css b/packages/css/index.css
@@ -10,7 +10,6 @@
 @import url('./baseline/typography/ingress.css') layer(ds.base.typography);
 @import url('./baseline/typography/error-message.css') layer(ds.base.typography);
 @import url('./utilities.css') layer(ds.utilities);
-@import url('./box.css') layer(ds.components);
 @import url('./button.css') layer(ds.components);
 @import url('./alert.css') layer(ds.components);
 @import url('./skiplink.css') layer(ds.components);

diff --git a/packages/react/src/components/Box/Box.mdx b/packages/react/src/components/Box/Box.mdx
diff --git a/packages/react/src/components/Box/Box.stories.tsx b/packages/react/src/components/Box/Box.stories.tsx
diff --git a/packages/react/src/components/Box/Box.test.tsx b/packages/react/src/components/Box/Box.test.tsx
diff --git a/packages/react/src/components/Box/Box.tsx b/packages/react/src/components/Box/Box.tsx
diff --git a/packages/react/src/components/Box/index.ts b/packages/react/src/components/Box/index.ts
diff --git a/packages/react/src/components/form/Combobox/Combobox.tsx b/packages/react/src/components/form/Combobox/Combobox.tsx
@@ -6,7 +6,6 @@ import type { InputHTMLAttributes, ReactNode } from 'react';
 
 import type { PortalProps } from '../../../types/Portal';
 import { omit, useDebounceCallback } from '../../../utilities';
-import { Box } from '../../Box';
 import { Spinner } from '../../Spinner';
 import type { FormFieldProps } from '../useFormField';
 import { useFormField } from '../useFormField';
@@ -367,7 +366,7 @@ export const ComboboxComponent = forwardRef<HTMLInputElement, ComboboxProps>(
           },
         }}
       >
-        <Box
+        <div
           className={cl(
             'ds-combobox',
             `ds-combobox--${size}`,
@@ -408,7 +407,7 @@ export const ComboboxComponent = forwardRef<HTMLInputElement, ComboboxProps>(
             error={error}
             formFieldProps={formFieldProps}
           />
-        </Box>
+        </div>
         {/* This is the floating list with options */}
         {open && (
           <FloatingPortal root={portal ? null : portalRef}>
@@ -417,11 +416,8 @@ export const ComboboxComponent = forwardRef<HTMLInputElement, ComboboxProps>(
               initialFocus={-1}
               visuallyHiddenDismiss
             >
-              <Box
+              <div
                 id={listId}
-                shadow='md'
-                borderRadius='md'
-                borderColor='default'
                 aria-labelledby={formFieldProps.inputProps.id}
                 aria-autocomplete='list'
                 tabIndex={-1}
@@ -476,7 +472,7 @@ export const ComboboxComponent = forwardRef<HTMLInputElement, ComboboxProps>(
                     {!virtual && filteredOptionsChildren}
                   </>
                 )}
-              </Box>
+              </div>
             </FloatingFocusManager>
           </FloatingPortal>
         )}

diff --git a/packages/react/src/components/form/Combobox/internal/ComboboxInput.tsx b/packages/react/src/components/form/Combobox/internal/ComboboxInput.tsx
@@ -5,7 +5,6 @@ import type { ChangeEvent } from 'react';
 import { useContext, useRef } from 'react';
 
 import { omit } from '../../../../utilities';
-import { Box } from '../../../Box';
 import { Paragraph } from '../../../Typography';
 import type { ComboboxProps } from '../Combobox';
 import { ComboboxContext } from '../ComboboxContext';
@@ -112,7 +111,7 @@ const ComboboxInput = ({
 
   return (
     <Paragraph size={size} asChild>
-      <Box
+      <div
         {...props}
         aria-disabled={disabled ? 'true' : undefined}
         className={cl(
@@ -158,7 +157,7 @@ const ComboboxInput = ({
             <ChevronDownIcon title='arrow down' fontSize='1.5em' />
           )}
         </div>
-      </Box>
+      </div>
     </Paragraph>
   );
 };

diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts
@@ -29,7 +29,6 @@ export * from './Modal';
 export * from './DropdownMenu';
 export * from './form/Search';
 export * from './Skeleton';
-export * from './Box/Box';
 export * from './Card';
 export * from './form/Combobox';
 export * from './Table';