@norges-domstoler/dds-components 22.8.1 → 22.9.0

package/dist/index.mjs

@@ -49,9 +49,11 @@ var typographyStyles_default = {
   "heading-xlarge--margins": "typographyStyles_heading-xlarge--margins",
   "heading-xxlarge": "typographyStyles_heading-xxlarge",
   "heading-xxlarge--margins": "typographyStyles_heading-xxlarge--margins",
+  "heading--margins-over-input": "typographyStyles_heading--margins-over-input",
   "label-medium": "typographyStyles_label-medium",
   "label-medium--margins": "typographyStyles_label-medium--margins",
   legend: "typographyStyles_legend",
+  "legend--margins-over-input": "typographyStyles_legend--margins-over-input",
   caption: "typographyStyles_caption",
   "caption--withMargins": "typographyStyles_caption--withMargins",
   bold: "typographyStyles_bold",
@@ -378,6 +380,12 @@ function cn(...classNames) {
 function convertCamelToHyphen(value) {
   return value.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/([a-z])([0-9])/g, "$1-$2").toLowerCase();
 }
+function optAttr(value, keepZero) {
+  if (keepZero && value === 0) {
+    return value;
+  }
+  return value ? value : void 0;
+}
 
 // src/utils/getFocusableElements.ts
 function getFocusableElements(elementRef) {
@@ -3934,6 +3942,8 @@ var Heading = ({
   children,
   typographyType,
   level,
+  withMargins,
+  withMarginsOverInput,
   ...rest
 }) => {
   const headingElement = getHeadingElement(level);
@@ -3941,9 +3951,19 @@ var Heading = ({
   return /* @__PURE__ */ jsx199(
     Typography,
     {
-      ...getBaseHTMLProps(id, className, style, htmlProps, rest),
+      ...getBaseHTMLProps(
+        id,
+        cn(
+          className,
+          withMarginsOverInput && typographyStyles_default["heading--margins-over-input"]
+        ),
+        style,
+        htmlProps,
+        rest
+      ),
       typographyType: standardTypographyType,
       as: headingElement,
+      withMargins: optAttr(withMargins || withMarginsOverInput),
       children
     }
   );
@@ -4022,14 +4042,26 @@ var Legend = ({
   style,
   htmlProps,
   typographyType = "headingLarge",
+  withMarginsOverInput,
+  withMargins,
   ...rest
 }) => {
   return /* @__PURE__ */ jsx201(
     Typography,
     {
-      ...getBaseHTMLProps(id, className, style, htmlProps, rest),
+      ...getBaseHTMLProps(
+        id,
+        cn(
+          className,
+          withMarginsOverInput && typographyStyles_default["legend--margins-over-input"]
+        ),
+        style,
+        htmlProps,
+        rest
+      ),
       as: "legend",
-      typographyType
+      typographyType,
+      withMargins: optAttr(withMargins || withMarginsOverInput)
     }
   );
 };
@@ -10936,9 +10968,9 @@ var getCustomStyles = (size2, hasError, isReadOnly) => ({
       backgroundColor: "var(--dds-color-surface-hover-default)"
     }
   },
-  menu: () => ({
+  menu: (provided) => ({
+    ...provided,
     boxSizing: "border-box",
-    position: "absolute",
     width: "100%",
     boxShadow: "var(--dds-shadow-medium)",
     zIndex: 100,
@@ -11153,6 +11185,7 @@ function Select({
   isClearable = true,
   placeholder,
   menuPortalTarget,
+  menuPlacement = "auto",
   customOptionElement,
   customSingleValueElement,
   "data-testid": dataTestId,
@@ -11248,12 +11281,13 @@ function Select({
     isClearable,
     hideSelectedOptions: hideSelectedOptions ? hideSelectedOptions : false,
     placeholder: placeholder ? placeholder : "",
-    closeMenuOnSelect: closeMenuOnSelect ? closeMenuOnSelect : isMulti ? false : true,
+    closeMenuOnSelect: closeMenuOnSelect ? closeMenuOnSelect : !isMulti,
     isMulti,
     instanceId: instanceId != null ? instanceId : useId21(),
     inputId: uniqueId,
     name: uniqueId,
     menuPortalTarget: portalTarget,
+    menuPlacement,
     classNamePrefix: prefix,
     styles: getCustomStyles(componentSize, hasErrorMessage, readOnly),
     filterOption: (option, inputValue) => {