@norges-domstoler/dds-components 10.1.1 → 10.2.0

package/dist/cjs/components/FormGenerator/FormGenerator.types.d.ts

@@ -4,6 +4,7 @@ import { ButtonProps } from '../Button';
 import { CardProps } from '../Card';
 import { CheckboxGroupProps, CheckboxProps } from '../Checkbox';
 import { DatepickerProps } from '../Datepicker';
+import { DescriptionListProps, DescriptionListDescProps, DescriptionListGroupProps, DescriptionListTermProps } from '../DescriptionList';
 import { DividerProps } from '../Divider';
 import { GlobalMessageProps } from '../GlobalMessage';
 import { InputMessageProps } from '../InputMessage';
@@ -28,8 +29,8 @@ export declare type FormGeneratorRow = {
     fields: FormGeneratorField[];
 };
 export declare type FormGeneratorField = FieldWithChildren | FieldWithoutChildren;
-declare type FieldWithChildren = CheckboxGroupField | ListField | RadioButtonGroupField | ToggleButtonGroupField;
-declare type FieldWithoutChildren = ButtonField | CardField | CheckboxField | DatepickerField | DividerField | GlobalMessageField | HeadingField | InputMessageField | LabelField | LinkField | ListItemField | LocalMessageField | ParagraphField | RadioButtonField | SelectField | SpinnerField | TextInputField | ToggleButtonField | TypographyField | VisuallyHiddenField;
+declare type FieldWithChildren = CheckboxGroupField | DescriptionListField | DescriptionListGroupField | ListField | RadioButtonGroupField | ToggleButtonGroupField;
+declare type FieldWithoutChildren = ButtonField | CardField | CheckboxField | DatepickerField | DescriptionListTermField | DescriptionListDescField | DividerField | GlobalMessageField | HeadingField | InputMessageField | LabelField | LinkField | ListItemField | LocalMessageField | ParagraphField | RadioButtonField | SelectField | SpinnerField | TextInputField | ToggleButtonField | TypographyField | VisuallyHiddenField;
 declare type ButtonField = {
     component: 'Button';
     props: ButtonProps;
@@ -57,6 +58,30 @@ declare type DatepickerField = {
     props: DatepickerProps;
     hide?: boolean;
 };
+declare type DescriptionListField = {
+    component: 'DescriptionList';
+    props: DescriptionListProps;
+    hide?: boolean;
+    children: DescriptionListGroupField[];
+};
+declare type DescriptionListGroupField = {
+    component: 'DescriptionListGroup';
+    props: DescriptionListGroupProps;
+    hide?: boolean;
+    children: (DescriptionListTermField | DescriptionListDescField)[];
+};
+declare type DescriptionListTermField = {
+    component: 'DescriptionListTerm';
+    props: DescriptionListTermProps;
+    hide?: boolean;
+    innerHTML: JSX.Element | string;
+};
+declare type DescriptionListDescField = {
+    component: 'DescriptionListDesc';
+    props: DescriptionListDescProps;
+    hide?: boolean;
+    innerHTML: JSX.Element | string;
+};
 declare type DividerField = {
     component: 'Divider';
     props: DividerProps;

package/dist/cjs/index.js

@@ -5532,6 +5532,7 @@ var useScreenSize = function useScreenSize() {
         _iterator.f();
       }
     }
+    listener();
     window.addEventListener('resize', listener);
     return function () {
       return window.removeEventListener('resize', listener);
@@ -10663,6 +10664,10 @@ var FormGenerator = function FormGenerator(props) {
   var _props$fields = props.fields,
     fields = _props$fields === void 0 ? [] : _props$fields,
     stateOnChange = props.stateOnChange;
+  var id = props.id,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = tslib.__rest(props, ["id", "className", "htmlProps"]);
   var _useState = React.useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     myState = _useState2[0],
@@ -10719,6 +10724,26 @@ var FormGenerator = function FormGenerator(props) {
           key: index,
           onChange: fieldOnChange
         }));
+      case 'DescriptionList':
+        return /*#__PURE__*/React.createElement(DescriptionList, Object.assign({}, field.props, {
+          key: index
+        }), field.children.map(function (child, childIndex) {
+          return !child.hide && GetComponent(child, childIndex);
+        }));
+      case 'DescriptionListGroup':
+        return /*#__PURE__*/React.createElement(DescriptionListGroup, Object.assign({}, field.props, {
+          key: index
+        }), field.children.map(function (child, childIndex) {
+          return !child.hide && GetComponent(child, childIndex);
+        }));
+      case 'DescriptionListDesc':
+        return /*#__PURE__*/React.createElement(DescriptionListDesc, Object.assign({}, field.props, {
+          key: index
+        }), field.innerHTML);
+      case 'DescriptionListTerm':
+        return /*#__PURE__*/React.createElement(DescriptionListTerm, Object.assign({}, field.props, {
+          key: index
+        }), field.innerHTML);
       case 'Divider':
         return /*#__PURE__*/React.createElement(Divider, Object.assign({}, field.props, {
           key: index
@@ -10816,7 +10841,7 @@ var FormGenerator = function FormGenerator(props) {
     return obj.rowType !== undefined;
   };
   var screenSize = useScreenSize();
-  return jsxRuntime.jsx(Grid, Object.assign({
+  return jsxRuntime.jsx(Grid, Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest), {
     as: "form",
     rowGap: formGeneratorTokens.rowGaps
   }, {

package/dist/components/FormGenerator/FormGenerator.js

@@ -1,4 +1,5 @@
 import { slicedToArray as _slicedToArray, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from 'tslib';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { useState, createElement } from 'react';
 import { Button } from '../Button/Button.js';
@@ -9,6 +10,10 @@ import '../Card/CardAccordion/CardAccordionBody.js';
 import { Checkbox } from '../Checkbox/Checkbox.js';
 import { CheckboxGroup } from '../Checkbox/CheckboxGroup.js';
 import { Datepicker } from '../Datepicker/Datepicker.js';
+import { DescriptionList } from '../DescriptionList/DescriptionList.js';
+import { DescriptionListTerm } from '../DescriptionList/DescriptionListTerm.js';
+import { DescriptionListDesc } from '../DescriptionList/DescriptionListDesc.js';
+import { DescriptionListGroup } from '../DescriptionList/DescriptionListGroup.js';
 import { Divider } from '../Divider/Divider.js';
 import { GlobalMessage } from '../GlobalMessage/GlobalMessage.js';
 import { InputMessage } from '../InputMessage/InputMessage.js';
@@ -27,7 +32,7 @@ import { Label } from '../Typography/Label/Label.js';
 import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
 import { Heading } from '../Typography/Heading/Heading.js';
 import { Link } from '../Typography/Link/Link.js';
-import 'tslib';
+import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
 import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 import { Grid } from '../Grid/Grid.js';
 import { GridChild } from '../Grid/GridChild.js';
@@ -39,6 +44,10 @@ var FormGenerator = function FormGenerator(props) {
   var _props$fields = props.fields,
     fields = _props$fields === void 0 ? [] : _props$fields,
     stateOnChange = props.stateOnChange;
+  var id = props.id,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = __rest(props, ["id", "className", "htmlProps"]);
   var _useState = useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     myState = _useState2[0],
@@ -95,6 +104,26 @@ var FormGenerator = function FormGenerator(props) {
           key: index,
           onChange: fieldOnChange
         }));
+      case 'DescriptionList':
+        return /*#__PURE__*/createElement(DescriptionList, Object.assign({}, field.props, {
+          key: index
+        }), field.children.map(function (child, childIndex) {
+          return !child.hide && GetComponent(child, childIndex);
+        }));
+      case 'DescriptionListGroup':
+        return /*#__PURE__*/createElement(DescriptionListGroup, Object.assign({}, field.props, {
+          key: index
+        }), field.children.map(function (child, childIndex) {
+          return !child.hide && GetComponent(child, childIndex);
+        }));
+      case 'DescriptionListDesc':
+        return /*#__PURE__*/createElement(DescriptionListDesc, Object.assign({}, field.props, {
+          key: index
+        }), field.innerHTML);
+      case 'DescriptionListTerm':
+        return /*#__PURE__*/createElement(DescriptionListTerm, Object.assign({}, field.props, {
+          key: index
+        }), field.innerHTML);
       case 'Divider':
         return /*#__PURE__*/createElement(Divider, Object.assign({}, field.props, {
           key: index
@@ -192,7 +221,7 @@ var FormGenerator = function FormGenerator(props) {
     return obj.rowType !== undefined;
   };
   var screenSize = useScreenSize();
-  return jsx(Grid, Object.assign({
+  return jsx(Grid, Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest), {
     as: "form",
     rowGap: formGeneratorTokens.rowGaps
   }, {

package/dist/components/FormGenerator/FormGenerator.types.d.ts

@@ -4,6 +4,7 @@ import { ButtonProps } from '../Button';
 import { CardProps } from '../Card';
 import { CheckboxGroupProps, CheckboxProps } from '../Checkbox';
 import { DatepickerProps } from '../Datepicker';
+import { DescriptionListProps, DescriptionListDescProps, DescriptionListGroupProps, DescriptionListTermProps } from '../DescriptionList';
 import { DividerProps } from '../Divider';
 import { GlobalMessageProps } from '../GlobalMessage';
 import { InputMessageProps } from '../InputMessage';
@@ -28,8 +29,8 @@ export declare type FormGeneratorRow = {
     fields: FormGeneratorField[];
 };
 export declare type FormGeneratorField = FieldWithChildren | FieldWithoutChildren;
-declare type FieldWithChildren = CheckboxGroupField | ListField | RadioButtonGroupField | ToggleButtonGroupField;
-declare type FieldWithoutChildren = ButtonField | CardField | CheckboxField | DatepickerField | DividerField | GlobalMessageField | HeadingField | InputMessageField | LabelField | LinkField | ListItemField | LocalMessageField | ParagraphField | RadioButtonField | SelectField | SpinnerField | TextInputField | ToggleButtonField | TypographyField | VisuallyHiddenField;
+declare type FieldWithChildren = CheckboxGroupField | DescriptionListField | DescriptionListGroupField | ListField | RadioButtonGroupField | ToggleButtonGroupField;
+declare type FieldWithoutChildren = ButtonField | CardField | CheckboxField | DatepickerField | DescriptionListTermField | DescriptionListDescField | DividerField | GlobalMessageField | HeadingField | InputMessageField | LabelField | LinkField | ListItemField | LocalMessageField | ParagraphField | RadioButtonField | SelectField | SpinnerField | TextInputField | ToggleButtonField | TypographyField | VisuallyHiddenField;
 declare type ButtonField = {
     component: 'Button';
     props: ButtonProps;
@@ -57,6 +58,30 @@ declare type DatepickerField = {
     props: DatepickerProps;
     hide?: boolean;
 };
+declare type DescriptionListField = {
+    component: 'DescriptionList';
+    props: DescriptionListProps;
+    hide?: boolean;
+    children: DescriptionListGroupField[];
+};
+declare type DescriptionListGroupField = {
+    component: 'DescriptionListGroup';
+    props: DescriptionListGroupProps;
+    hide?: boolean;
+    children: (DescriptionListTermField | DescriptionListDescField)[];
+};
+declare type DescriptionListTermField = {
+    component: 'DescriptionListTerm';
+    props: DescriptionListTermProps;
+    hide?: boolean;
+    innerHTML: JSX.Element | string;
+};
+declare type DescriptionListDescField = {
+    component: 'DescriptionListDesc';
+    props: DescriptionListDescProps;
+    hide?: boolean;
+    innerHTML: JSX.Element | string;
+};
 declare type DividerField = {
     component: 'Divider';
     props: DividerProps;

package/dist/hooks/useScreenSize.js

@@ -49,6 +49,7 @@ var useScreenSize = function useScreenSize() {
         _iterator.f();
       }
     }
+    listener();
     window.addEventListener('resize', listener);
     return function () {
       return window.removeEventListener('resize', listener);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@norges-domstoler/dds-components",
-  "version": "10.1.1",
+  "version": "10.2.0",
   "description": "React components used in Elsa - domstolenes designsystem",
   "author": "Elsa team",
   "license": "MIT",