@norges-domstoler/dds-components 0.0.0-dev-20240311115727 → 0.0.0-dev-20240313120652

package/dist/index.d.mts

@@ -456,7 +456,7 @@ declare const Link: react.ForwardRefExoticComponent<Pick<Omit<AnchorHTMLAttribut
     /**Spesifiserer om lenken fører til et eksternt nettsted eller åpnes i nytt vindu. Påvirker styling og setter `target` prop. */
     external?: boolean | undefined;
     /**Spesifiserer typografistil basert på utvalget for brødtekst.  */
-    typographyType?: ("bodySans01" | "bodySans02" | "bodySans03" | "bodySans04") | undefined;
+    typographyType?: TypographyBodyType | undefined;
 } & {
     withMargins?: boolean | undefined;
 } & {
@@ -471,7 +471,7 @@ type ParagraphProps = BaseComponentPropsWithChildren<HTMLParagraphElement, {
 } & BaseTypographyProps>;
 declare const Paragraph: react.ForwardRefExoticComponent<Pick<react.HTMLAttributes<HTMLParagraphElement>, "className" | "id"> & {
     /**Spesifiserer typografistil basert på utvalget for brødtekst og ingress.  */
-    typographyType?: ("bodySans01" | "bodySans02" | "bodySans03" | "bodySans04") | TypographyLeadType | undefined;
+    typographyType?: TypographyBodyType | TypographyLeadType | undefined;
 } & {
     withMargins?: boolean | undefined;
 } & {
@@ -1757,7 +1757,7 @@ declare const TimePicker: react.ForwardRefExoticComponent<Omit<AriaTimeFieldProp
      * Egendefinert bredde på komponenten.
      */
     width?: CSS.Properties['width'];
-} & Pick<InputProps, "style" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
+} & Pick<InputProps, "style" | "tip" | "componentSize" | "errorMessage"> & react.RefAttributes<HTMLDivElement>>;
 
 declare function nativeDateToDateValue(date: Date, timeZone?: string | undefined): DateValue$1;
 declare function dateValueToNativeDate(date: DateValue$1, timeZone?: string | undefined): Date;
@@ -2633,7 +2633,7 @@ type ForwardRefType<Option, IsMulti extends boolean> = React.ForwardedRef<Select
 declare function SelectInner<Option = unknown, IsMulti extends boolean = false>(props: SelectProps<Option, IsMulti>, ref: ForwardRefType<Option, IsMulti>): react_jsx_runtime.JSX.Element;
 declare const Select: typeof SelectInner;
 
-declare const createSelectOptions: <TValue extends string | number>(...args: TValue[]) => SelectOption<TValue>[];
+declare const createSelectOptions: <TValue extends string | number>(...args: Array<TValue>) => Array<SelectOption<TValue>>;
 
 type CheckboxPickedHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'aria-describedby' | 'name' | 'checked' | 'defaultChecked' | 'value' | 'defaultValue' | 'onChange' | 'onBlur'>;
 type CheckboxProps = BaseComponentProps<HTMLInputElement, {
@@ -2734,35 +2734,8 @@ type RadioButtonGroupProps<T extends string | number> = BaseComponentPropsWithCh
     /**custom id for for gruppen, knytter `label` til gruppen via `aria-label`. */
     groupId?: string;
 }, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>>;
-declare const RadioButtonGroup: <T extends string | number = string>(props: Pick<Omit<HTMLAttributes<HTMLDivElement>, "onChange">, "className" | "id"> & {
-    /** Gir alle barna `name` prop.*/
-    name?: string | undefined;
-    /**Ledetekst for hele gruppen. */
-    label?: string | undefined;
-    /**Funksjonen for onChange-event for barna. */
-    onChange?: ((event: ChangeEvent<HTMLInputElement>, value: T | undefined) => void) | undefined;
-    /**Legger en markør (*) bak label som indikerer at input er påkrevd. Gjør alle barna påkrevd ved å gi dem `required` prop. */
-    required?: boolean | undefined;
-    /**Meldingen som vises ved valideringsfeil. Gir alle barna error prop. */
-    errorMessage?: string | undefined;
-    /**Hjelpetekst for gruppen. */
-    tip?: string | undefined;
-    /**Gir alle barna `disabled` prop. */
-    disabled?: boolean | undefined;
-    /**Gir alle barna `readOnly` prop */
-    readOnly?: boolean | undefined;
-    /**Retningen radioknappene skal gjengis i. */
-    direction?: Direction$1 | undefined;
-    /**Default verdi - en `<RadioButton />` blir forhåndsvalgt. **OBS!** brukes kun når brukeren ikke skal fylle ut selv. */
-    value?: T | undefined;
-    /**custom id for for gruppen, knytter `label` til gruppen via `aria-label`. */
-    groupId?: string | undefined;
-} & {
-    children?: react.ReactNode;
-} & {
-    htmlProps?: Omit<HTMLAttributes<HTMLDivElement>, "onChange"> | undefined;
-} & {
-    ref?: Ref<HTMLDivElement> | undefined;
+declare const RadioButtonGroup: <T extends string | number = string>(props: RadioButtonGroupProps<T> & {
+    ref?: Ref<HTMLDivElement>;
 }) => ReactElement;
 
 type SkipToContentProps = BaseComponentProps<HTMLAnchorElement, {
@@ -2909,7 +2882,7 @@ type TableCellProps = {
      * @default 'data' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
      */
     type?: TableCellType;
-    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
+    /**Layout av innholdet i cellen; legger en flex `<div>` i cellen, unntatt 'none' som ikke legger inn noe. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
     layout?: TableCellLayout;
     /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
     collapsibleProps?: CollapsibleProps;

package/dist/index.d.ts

@@ -456,7 +456,7 @@ declare const Link: react.ForwardRefExoticComponent<Pick<Omit<AnchorHTMLAttribut
     /**Spesifiserer om lenken fører til et eksternt nettsted eller åpnes i nytt vindu. Påvirker styling og setter `target` prop. */
     external?: boolean | undefined;
     /**Spesifiserer typografistil basert på utvalget for brødtekst.  */
-    typographyType?: ("bodySans01" | "bodySans02" | "bodySans03" | "bodySans04") | undefined;
+    typographyType?: TypographyBodyType | undefined;
 } & {
     withMargins?: boolean | undefined;
 } & {
@@ -471,7 +471,7 @@ type ParagraphProps = BaseComponentPropsWithChildren<HTMLParagraphElement, {
 } & BaseTypographyProps>;
 declare const Paragraph: react.ForwardRefExoticComponent<Pick<react.HTMLAttributes<HTMLParagraphElement>, "className" | "id"> & {
     /**Spesifiserer typografistil basert på utvalget for brødtekst og ingress.  */
-    typographyType?: ("bodySans01" | "bodySans02" | "bodySans03" | "bodySans04") | TypographyLeadType | undefined;
+    typographyType?: TypographyBodyType | TypographyLeadType | undefined;
 } & {
     withMargins?: boolean | undefined;
 } & {
@@ -1757,7 +1757,7 @@ declare const TimePicker: react.ForwardRefExoticComponent<Omit<AriaTimeFieldProp
      * Egendefinert bredde på komponenten.
      */
     width?: CSS.Properties['width'];
-} & Pick<InputProps, "style" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
+} & Pick<InputProps, "style" | "tip" | "componentSize" | "errorMessage"> & react.RefAttributes<HTMLDivElement>>;
 
 declare function nativeDateToDateValue(date: Date, timeZone?: string | undefined): DateValue$1;
 declare function dateValueToNativeDate(date: DateValue$1, timeZone?: string | undefined): Date;
@@ -2633,7 +2633,7 @@ type ForwardRefType<Option, IsMulti extends boolean> = React.ForwardedRef<Select
 declare function SelectInner<Option = unknown, IsMulti extends boolean = false>(props: SelectProps<Option, IsMulti>, ref: ForwardRefType<Option, IsMulti>): react_jsx_runtime.JSX.Element;
 declare const Select: typeof SelectInner;
 
-declare const createSelectOptions: <TValue extends string | number>(...args: TValue[]) => SelectOption<TValue>[];
+declare const createSelectOptions: <TValue extends string | number>(...args: Array<TValue>) => Array<SelectOption<TValue>>;
 
 type CheckboxPickedHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'aria-describedby' | 'name' | 'checked' | 'defaultChecked' | 'value' | 'defaultValue' | 'onChange' | 'onBlur'>;
 type CheckboxProps = BaseComponentProps<HTMLInputElement, {
@@ -2734,35 +2734,8 @@ type RadioButtonGroupProps<T extends string | number> = BaseComponentPropsWithCh
     /**custom id for for gruppen, knytter `label` til gruppen via `aria-label`. */
     groupId?: string;
 }, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>>;
-declare const RadioButtonGroup: <T extends string | number = string>(props: Pick<Omit<HTMLAttributes<HTMLDivElement>, "onChange">, "className" | "id"> & {
-    /** Gir alle barna `name` prop.*/
-    name?: string | undefined;
-    /**Ledetekst for hele gruppen. */
-    label?: string | undefined;
-    /**Funksjonen for onChange-event for barna. */
-    onChange?: ((event: ChangeEvent<HTMLInputElement>, value: T | undefined) => void) | undefined;
-    /**Legger en markør (*) bak label som indikerer at input er påkrevd. Gjør alle barna påkrevd ved å gi dem `required` prop. */
-    required?: boolean | undefined;
-    /**Meldingen som vises ved valideringsfeil. Gir alle barna error prop. */
-    errorMessage?: string | undefined;
-    /**Hjelpetekst for gruppen. */
-    tip?: string | undefined;
-    /**Gir alle barna `disabled` prop. */
-    disabled?: boolean | undefined;
-    /**Gir alle barna `readOnly` prop */
-    readOnly?: boolean | undefined;
-    /**Retningen radioknappene skal gjengis i. */
-    direction?: Direction$1 | undefined;
-    /**Default verdi - en `<RadioButton />` blir forhåndsvalgt. **OBS!** brukes kun når brukeren ikke skal fylle ut selv. */
-    value?: T | undefined;
-    /**custom id for for gruppen, knytter `label` til gruppen via `aria-label`. */
-    groupId?: string | undefined;
-} & {
-    children?: react.ReactNode;
-} & {
-    htmlProps?: Omit<HTMLAttributes<HTMLDivElement>, "onChange"> | undefined;
-} & {
-    ref?: Ref<HTMLDivElement> | undefined;
+declare const RadioButtonGroup: <T extends string | number = string>(props: RadioButtonGroupProps<T> & {
+    ref?: Ref<HTMLDivElement>;
 }) => ReactElement;
 
 type SkipToContentProps = BaseComponentProps<HTMLAnchorElement, {
@@ -2909,7 +2882,7 @@ type TableCellProps = {
      * @default 'data' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
      */
     type?: TableCellType;
-    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
+    /**Layout av innholdet i cellen; legger en flex `<div>` i cellen, unntatt 'none' som ikke legger inn noe. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
     layout?: TableCellLayout;
     /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
     collapsibleProps?: CollapsibleProps;

package/dist/index.js

@@ -9423,7 +9423,12 @@ var bar = {
   minHeight: "57px",
   borderBottom: `${border10.BordersDdsBorderStyleLightStroke} solid ${border10.BordersDdsBorderStyleLightStrokeWeight}`,
   paddingLeft: spacing24.SizesDdsSpacingX15,
-  paddingRight: spacing24.SizesDdsSpacingX15
+  paddingRight: spacing24.SizesDdsSpacingX15,
+  smallScreen: {
+    itemGap: spacing24.SizesDdsSpacingX1,
+    paddingLeft: spacing24.SizesDdsSpacingX1,
+    paddingRight: spacing24.SizesDdsSpacingX05
+  }
 };
 var separator = {
   color: border10.BordersDdsBorderStyleLightStroke,
@@ -9448,6 +9453,11 @@ var Bar2 = import_styled_components64.default.div`
   border-bottom: ${bar2.borderBottom};
   padding-left: ${bar2.paddingLeft};
   padding-right: ${bar2.paddingRight};
+  ${({ $smallScreen }) => $smallScreen && import_styled_components64.css`
+      gap: ${bar2.smallScreen.itemGap};
+      padding-left: ${bar2.smallScreen.paddingLeft};
+      padding-right: ${bar2.smallScreen.paddingRight};
+    `}
 
   ${({ $hasNavigation }) => $hasNavigation ? import_styled_components64.css`
           ${ContextMenuGroup} {
@@ -9630,6 +9640,7 @@ var InternalHeader = (props) => {
     {
       ...getBaseHTMLProps(id, className, htmlProps, rest),
       $hasNavigation: !!navigation2,
+      $smallScreen: smallScreen,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Typography, { typographyType: "bodySans02", bold: true, as: "span", children: applicationHref ? /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(AppNameLink, { href: applicationHref, rel: "noopener noreferrer", children: applicationName }) : applicationName }),
         /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Typography, { typographyType: "bodySans02", as: "span", children: applicationDesc }),
@@ -13026,11 +13037,11 @@ var getLayoutStyle = (layout) => {
   switch (layout) {
     case "center":
       return import_styled_components85.css`
-        justify-content: center;
+        text-align: center;
       `;
     case "right":
       return import_styled_components85.css`
-        justify-content: flex-end;
+        text-align: right;
       `;
     case "text and icon":
       return import_styled_components85.css`
@@ -13045,6 +13056,7 @@ var StyledCell = import_styled_components85.default.td`
   ${({ $type: type }) => type === "head" && import_styled_components85.css`
       background-color: ${cell3.head.backgroundColor};
     `}
+  ${({ $layout: layout }) => layout && getLayoutStyle(layout)}
 `;
 var InnerCell = import_styled_components85.default.div`
   display: flex;
@@ -13066,7 +13078,18 @@ var Cell2 = (0, import_react102.forwardRef)(
     const type = _type != null ? _type : isInHead ? "head" : "data";
     const as = getTableCellType(type);
     const { isCollapsibleChild } = collapsibleProps != null ? collapsibleProps : {};
-    return isCollapsibleChild ? /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(DescriptionListDesc, { children }) : /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(StyledCell, { as, ref, $type: type, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(InnerCell, { $layout: layout, children }) });
+    const isComplexLayout = layout === "text and icon";
+    return isCollapsibleChild ? /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(DescriptionListDesc, { children }) : /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(
+      StyledCell,
+      {
+        as,
+        ref,
+        $layout: isComplexLayout ? void 0 : layout,
+        $type: type,
+        ...rest,
+        children: isComplexLayout ? /* @__PURE__ */ (0, import_jsx_runtime259.jsx)(InnerCell, { $layout: layout, children }) : children
+      }
+    );
   }
 );
 Cell2.displayName = "Table.Cell";