@navikt/ds-react 0.17.20 → 0.17.23

package/cjs/tooltip/Tooltip.js

@@ -116,7 +116,10 @@ const Tooltip = (0, react_1.forwardRef)((_a, ref) => {
                 ? (0, classnames_1.default)(ariaId, children === null || children === void 0 ? void 0 : children.props["aria-describedby"])
                 : children === null || children === void 0 ? void 0 : children.props["aria-describedby"], ref: (0, react_merge_refs_1.default)([children.ref, refs.reference]), onMouseEnter: (0, __1.composeEventHandlers)(children.props.onMouseEnter, handleDelayedOpen), onMouseLeave: (0, __1.composeEventHandlers)(children.props.onMouseLeave, handleClose), onMouseDown: (0, __1.composeEventHandlers)(children.props.onMouseDown, () => {
                 isMouseDownRef.current = true;
-                document.addEventListener("mouseup", handleMouseUp, { once: true });
+                document &&
+                    document.addEventListener("mouseup", handleMouseUp, {
+                        once: true,
+                    });
             }), onFocus: (0, __1.composeEventHandlers)(children.props.onFocus, () => !isMouseDownRef.current && handleOpen()), onBlur: (0, __1.composeEventHandlers)(children.props.onBlur, handleClose) })),
         (open !== null && open !== void 0 ? open : isOpen) && (react_1.default.createElement(portal_1.default, null,
             react_1.default.createElement("div", Object.assign({ ref: stableRef }, rest, { onMouseEnter: handleOpen, onMouseLeave: handleClose, role: "tooltip", id: ariaId, style: {

package/esm/tooltip/Tooltip.js

@@ -88,7 +88,10 @@ const Tooltip = forwardRef((_a, ref) => {
                 ? cl(ariaId, children === null || children === void 0 ? void 0 : children.props["aria-describedby"])
                 : children === null || children === void 0 ? void 0 : children.props["aria-describedby"], ref: mergeRefs([children.ref, refs.reference]), onMouseEnter: composeEventHandlers(children.props.onMouseEnter, handleDelayedOpen), onMouseLeave: composeEventHandlers(children.props.onMouseLeave, handleClose), onMouseDown: composeEventHandlers(children.props.onMouseDown, () => {
                 isMouseDownRef.current = true;
-                document.addEventListener("mouseup", handleMouseUp, { once: true });
+                document &&
+                    document.addEventListener("mouseup", handleMouseUp, {
+                        once: true,
+                    });
             }), onFocus: composeEventHandlers(children.props.onFocus, () => !isMouseDownRef.current && handleOpen()), onBlur: composeEventHandlers(children.props.onBlur, handleClose) })),
         (open !== null && open !== void 0 ? open : isOpen) && (React.createElement(Portal, null,
             React.createElement("div", Object.assign({ ref: stableRef }, rest, { onMouseEnter: handleOpen, onMouseLeave: handleClose, role: "tooltip", id: ariaId, style: {

package/esm/tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/tooltip/Tooltip.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/tooltip/Tooltip.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "0.17.20",
+  "version": "0.17.23",
   "private": false,
   "description": "NAV designsystem react components",
   "author": "NAV Designsystem team",
@@ -36,7 +36,7 @@
   "dependencies": {
     "@floating-ui/react-dom": "0.6.0",
     "@material-ui/core": "^4.12.3",
-    "@navikt/ds-icons": "^0.8.8",
+    "@navikt/ds-icons": "^0.8.10",
     "@popperjs/core": "^2.10.1",
     "@radix-ui/react-tabs": "0.1.5",
     "@radix-ui/react-toggle-group": "0.1.5",
@@ -67,7 +67,7 @@
   },
   "peerDependencies": {
     "@types/react": "^17.0.30",
-    "react": "^17.0.0 | ^18.0.0"
+    "react": "^17.0.0 || ^18.0.0"
   },
-  "gitHead": "3daa36efa72838b104d80bfaf259723773d11655"
+  "gitHead": "d5f2e044e8887f4e85b9d15ec15d3b2faf0760fd"
 }

package/src/form/checkbox/checkbox.stories.tsx

@@ -0,0 +1,178 @@
+import React, { useState } from "react";
+import { Checkbox, CheckboxGroup } from "../../index";
+import { Meta } from "@storybook/react/types-6-0";
+
+export default {
+  title: "ds-react/Form/Checkbox",
+  component: Checkbox,
+  subcomponents: {
+    CheckboxGroup,
+  },
+} as Meta;
+
+export const Default = (props) => {
+  const [state, setState] = useState(["checkbox1"]);
+
+  return (
+    <CheckboxGroup
+      legend={props.legend}
+      description={props.description}
+      value={props.controlled ? state : undefined}
+      onChange={props.controlled ? setState : undefined}
+      hideLegend={props.hideLegend}
+      error={props.errorGroup ? "Errormelding" : undefined}
+      {...props}
+    >
+      <Checkbox
+        value="checkbox1"
+        indeterminate={props.indeterminate}
+        hideLabel={props.hideLabel}
+      >
+        {props.children || "Apple"}
+      </Checkbox>
+      <Checkbox
+        value="checkbox2"
+        error={props.errorSingle}
+        description={
+          props.checkboxDescription ? "Orange description" : undefined
+        }
+        indeterminate={props.indeterminate}
+        hideLabel={props.hideLabel}
+      >
+        {props.children || "Orange"}
+      </Checkbox>
+      <Checkbox
+        value="checkbox3"
+        indeterminate={props.indeterminate}
+        hideLabel={props.hideLabel}
+      >
+        {props.children || "Banana"}
+      </Checkbox>
+      <Checkbox
+        value="checkbox4"
+        indeterminate={props.indeterminate}
+        hideLabel={props.hideLabel}
+      >
+        {props.children || "Melon"}
+      </Checkbox>
+    </CheckboxGroup>
+  );
+};
+
+Default.args = {
+  controlled: false,
+  legend: "Legend-tekst",
+  checkboxDescription: false,
+  hideLegend: false,
+  errorSingle: false,
+  children: "",
+  description: "",
+};
+
+export const Group = () => (
+  <CheckboxGroup legend="Group legend" defaultValue={["tekst2"]}>
+    <Checkbox value="tekst">Checkboxtekst</Checkbox>
+    <Checkbox value="tekst2">Checkboxtekst</Checkbox>
+  </CheckboxGroup>
+);
+
+export const GroupError = () => (
+  <CheckboxGroup
+    legend="Group legend"
+    defaultValue={["tekst2"]}
+    error="Group errormelding"
+  >
+    <Checkbox value="tekst">Checkboxtekst</Checkbox>
+    <Checkbox value="tekst2">Checkboxtekst</Checkbox>
+  </CheckboxGroup>
+);
+
+export const GroupSmall = () => (
+  <CheckboxGroup legend="Group legend" defaultValue={["tekst2"]} size="small">
+    <Checkbox value="tekst">Checkboxtekst</Checkbox>
+    <Checkbox value="tekst2">Checkboxtekst</Checkbox>
+  </CheckboxGroup>
+);
+
+export const GroupDescription = () => (
+  <CheckboxGroup
+    legend="Group legend"
+    defaultValue={["tekst2"]}
+    description="Group description"
+  >
+    <Checkbox value="tekst">Checkboxtekst</Checkbox>
+    <Checkbox value="tekst2">Checkboxtekst</Checkbox>
+  </CheckboxGroup>
+);
+
+export const Single = () => (
+  <div className="colspan">
+    <Checkbox value="tekst">Checkboxtekst</Checkbox>
+    <Checkbox value="tekst" defaultChecked>
+      Checkboxtekst
+    </Checkbox>
+  </div>
+);
+
+export const SingleSmall = () => (
+  <div className="colspan">
+    <Checkbox value="tekst" size="small">
+      Checkboxtekst
+    </Checkbox>
+    <Checkbox value="tekst" defaultChecked size="small">
+      Checkboxtekst
+    </Checkbox>
+  </div>
+);
+
+export const SingleDescription = () => (
+  <div className="colspan">
+    <Checkbox value="tekst" description="checkboxdescription">
+      Checkboxtekst
+    </Checkbox>
+    <Checkbox value="tekst" defaultChecked description="checkboxdescription">
+      Checkboxtekst
+    </Checkbox>
+  </div>
+);
+
+export const SingleError = () => (
+  <div className="colspan">
+    <Checkbox value="tekst" error>
+      Checkboxtekst
+    </Checkbox>
+    <Checkbox value="tekst" defaultChecked error>
+      Checkboxtekst
+    </Checkbox>
+  </div>
+);
+
+export const Indeterminate = () => {
+  const [checked, setChecked] = useState([true, false]);
+
+  return (
+    <>
+      <Checkbox
+        checked={checked[0] && checked[1]}
+        indeterminate={checked[0] !== checked[1]}
+        onChange={(e) => setChecked([e.target.checked, e.target.checked])}
+      >
+        Parent
+      </Checkbox>
+      <div style={{ paddingLeft: "2rem" }}>
+        <Checkbox
+          checked={checked[0]}
+          onChange={(e) => setChecked([e.target.checked, checked[1]])}
+        >
+          Child 1
+        </Checkbox>
+        <Checkbox
+          checked={checked[1]}
+          onChange={(e) => setChecked([checked[0], e.target.checked])}
+        >
+          Child 2
+        </Checkbox>
+      </div>
+    </>
+  );
+};

package/src/form/error-summary/error-summary.stories.tsx

@@ -0,0 +1,42 @@
+import React from "react";
+import { Meta } from "@storybook/react/types-6-0";
+import { ErrorSummary } from "..";
+export default {
+  title: "ds-react/Form/Errorsummary",
+  component: ErrorSummary,
+  argTypes: {
+    headingTag: {
+      control: {
+        type: "text",
+      },
+    },
+    size: {
+      control: {
+        type: "radio",
+        options: ["medium", "small"],
+      },
+    },
+  },
+} as Meta;
+
+export const Default = (props) => (
+  <ErrorSummary
+    heading="Feiloppsummering komponent"
+    headingTag={props.headingTag || "h2"}
+    size={props.size ?? undefined}
+  >
+    <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
+    <ErrorSummary.Item href="#2">
+      Tekstfeltet må ha en godkjent e-mail
+    </ErrorSummary.Item>
+  </ErrorSummary>
+);
+
+export const Small = () => (
+  <ErrorSummary heading="Feiloppsummering komponent" size="small">
+    <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
+    <ErrorSummary.Item href="#2">
+      Tekstfeltet må ha en godkjent e-mail
+    </ErrorSummary.Item>
+  </ErrorSummary>
+);

package/src/form/radio/radio.stories.tsx

@@ -0,0 +1,82 @@
+import React, { useState } from "react";
+import { Radio, RadioGroup } from "../../index";
+import { Meta } from "@storybook/react/types-6-0";
+
+export default {
+  title: "ds-react/Form/Radio",
+  component: Radio,
+  subcomponents: {
+    RadioGroup,
+  },
+} as Meta;
+
+export const Default = (props) => {
+  const [state, setState] = useState("radio1");
+
+  return (
+    <RadioGroup
+      legend={props.legend}
+      description={props.description}
+      value={props.controlled ? state : undefined}
+      onChange={props.controlled ? setState : undefined}
+      hideLegend={props.hideLegend}
+      error={props.errorGroup ? "Errormelding" : undefined}
+      {...props}
+    >
+      <Radio value="radio1">{props.children || "Apple"}</Radio>
+      <Radio
+        value="radio2"
+        description={props.radioDescription ? "Orange description" : undefined}
+      >
+        {props.children || "Orange"}
+      </Radio>
+      <Radio value="radio3">{props.children || "Banana"}</Radio>
+      <Radio value="radio4">{props.children || "Melon"}</Radio>
+    </RadioGroup>
+  );
+};
+
+Default.args = {
+  controlled: false,
+  legend: "Legend-tekst",
+  radioDescription: false,
+  hideLegend: false,
+  children: "",
+  description: "",
+};
+
+export const Group = () => (
+  <RadioGroup legend="Group legend" defaultValue={"tekst2"}>
+    <Radio value="tekst">Radiotekst</Radio>
+    <Radio value="tekst2">Radiotekst</Radio>
+  </RadioGroup>
+);
+
+export const GroupError = () => (
+  <RadioGroup
+    legend="Group legend"
+    defaultValue={"tekst2"}
+    error="Group errormelding"
+  >
+    <Radio value="tekst">Radiotekst</Radio>
+    <Radio value="tekst2">Radiotekst</Radio>
+  </RadioGroup>
+);
+
+export const GroupSmall = () => (
+  <RadioGroup legend="Group legend" defaultValue={"tekst2"} size="small">
+    <Radio value="tekst">Radiotekst</Radio>
+    <Radio value="tekst2">Radiotekst</Radio>
+  </RadioGroup>
+);
+
+export const GroupDescription = () => (
+  <RadioGroup
+    legend="Group legend"
+    defaultValue={"tekst2"}
+    description="Group description"
+  >
+    <Radio value="tekst">Radiotekst</Radio>
+    <Radio value="tekst2">Radiotekst</Radio>
+  </RadioGroup>
+);

package/src/form/search/search.stories.tsx

@@ -3,99 +3,140 @@ import React, { useState } from "react";
 
 import { Search } from "../index";
 export default {
-  title: "ds-react/form/search",
+  title: "ds-react/Form/Search",
   component: Search,
+  argTypes: {
+    clearButton: {
+      control: {
+        type: "boolean",
+      },
+    },
+    size: {
+      control: {
+        type: "radio",
+        options: ["medium", "small"],
+      },
+    },
+    variant: {
+      control: {
+        type: "radio",
+        options: ["primary", "secondary", "simple"],
+      },
+    },
+  },
 } as Meta;
 
-export const All = () => {
-  const [value, setValue] = useState("");
+export const Default = (props) => {
+  const [state, setState] = useState("");
   return (
-    <div
-      style={{
-        display: "flex",
-        alignItems: "center",
-        flexDirection: "column",
-        maxWidth: 400,
-      }}
-    >
-      <h1>Search</h1>
-
-      <Search label="Søk alle sider om X og Y" onSearch={console.log}></Search>
-      <h2>Secondary</h2>
+    <div data-theme={props.darkmode ? "dark" : "light"}>
       <Search
-        label="Søk alle sider om X og Y"
-        onSearch={console.log}
-        variant="secondary"
-      ></Search>
+        value={props.controlled ? state : undefined}
+        onChange={props.controlled ? setState : null}
+        onSearch={(v) => console.log({ onSearch: v })}
+        label="Søk"
+        size={props.size}
+        clearButton={props.clearButton}
+        variant={props.variant}
+        hideLabel={props.hideLabel}
+      />
+    </div>
+  );
+};
 
-      <h2>No button</h2>
-      <Search
-        label="Søk alle sider om X og Y"
-        onSearch={console.log}
-        variant="simple"
-      ></Search>
+Default.args = {
+  controlled: false,
+  darkmode: false,
+  hideLabel: true,
+};
 
-      <h2>Search small</h2>
-      <Search
-        label="Søk alle sider om X og Y"
-        description="Beskrivelse av søket"
-        size="small"
-      >
-        <Search.Button />
-      </Search>
-      <br />
-      <Search
-        label="Søk alle sider om X og Y"
-        description="Beskrivelse av søket"
-        size="small"
-        hideLabel
-        variant="secondary"
-      >
-        <Search.Button />
-      </Search>
+export const Small = () => (
+  <div className="rowgap">
+    <div className="colgap">
+      <Search label="Søk" size="small" />
+      <Search label="Søk" variant="secondary" size="small" />
+      <Search label="Søk" variant="simple" size="small" />
+    </div>
+    <div className="colgap" data-theme="dark">
+      <Search label="Søk" size="small" />
+      <Search label="Søk" variant="secondary" size="small" />
+      <Search label="Søk" variant="simple" size="small" />
+    </div>
+  </div>
+);
+
+export const Variants = () => (
+  <div className="rowgap">
+    <div className="colgap">
+      <Search label="Søk" />
+      <Search label="Søk" variant="secondary" />
+      <Search label="Søk" variant="simple" />
+    </div>
+    <div className="colgap" data-theme="dark">
+      <Search label="Søk" />
+      <Search label="Søk" variant="secondary" />
+      <Search label="Søk" variant="simple" />
+    </div>
+  </div>
+);
+
+export const Placeholder = () => (
+  <div className="rowgap">
+    <div className="colgap">
+      <Search label="Søk" placeholder="Søk" />
+    </div>
+    <div className="colgap" data-theme="dark">
+      <Search label="Søk" placeholder="Søk" />
+    </div>
+  </div>
+);
+
+export const Text = () => (
+  <div className="rowgap">
+    <div className="colgap">
+      <Search label="Søk" value="Søketekst" />
+      <Search label="Søk" variant="secondary" value="Søketekst" />
+      <Search label="Søk" variant="simple" value="Søketekst" />
+    </div>
+    <div className="colgap" data-theme="dark">
+      <Search label="Søk" value="Søketekst" />
+      <Search label="Søk" variant="secondary" value="Søketekst" />
+      <Search label="Søk" variant="simple" value="Søketekst" />
+    </div>
+  </div>
+);
 
-      <h2>Med knappe-tekst</h2>
-      <Search label="Søk alle sider om X og Y" hideLabel={false}>
-        <Search.Button>Søk</Search.Button>
-      </Search>
+export const WLabel = () => (
+  <div className="rowgap">
+    <div className="colgap">
+      <Search label="Label søk" variant="simple" hideLabel={false} />
       <Search
-        label="Søk alle sider om X og Y"
+        label="Label søk"
+        description="Description søk"
+        variant="simple"
         hideLabel={false}
-        variant="primary"
-      >
-        <Search.Button>Søk</Search.Button>
-      </Search>
-      <h2>Hidelabel false</h2>
-      <Search label="Søk alle sider om X og Y" hideLabel={false}>
-        <Search.Button />
-      </Search>
-      <h2>Controlled state </h2>
-      <Search
-        value={value}
-        label="Søk alle sider om X og Y"
-        description="Beskrivelse av søket"
-        onChange={(e) => setValue(e)}
-        onClear={() => setValue("")}
-      >
-        <Search.Button />
-      </Search>
-      <h2>No clear button</h2>
+      />
+    </div>
+    <div className="colgap" data-theme="dark">
+      <Search label="Label søk" variant="simple" hideLabel={false} />
       <Search
-        hideLabel
-        label="Søk alle sider om X og Y"
-        description="Beskrivelse av søket"
-        clearButton={false}
-      >
-        <Search.Button />
-      </Search>
+        label="Label søk"
+        description="Description søk"
+        variant="simple"
+        hideLabel={false}
+      />
     </div>
-  );
-};
+  </div>
+);
 
-export const UUDemo = () => {
-  return (
-    <Search label="Søk på nav.no" onSearch={console.log} placeholder="Søk">
-      <Search.Button />
-    </Search>
-  );
-};
+export const NoClearButton = () => (
+  <div className="colgap">
+    <Search label="Label søk" clearButton={false} value="søketekst" />
+    <Search
+      label="Label søk"
+      variant="simple"
+      clearButton={false}
+      value="søketekst"
+    />
+  </div>
+);

package/src/tooltip/Tooltip.tsx

@@ -212,7 +212,10 @@ const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
           ),
           onMouseDown: composeEventHandlers(children.props.onMouseDown, () => {
             isMouseDownRef.current = true;
-            document.addEventListener("mouseup", handleMouseUp, { once: true });
+            document &&
+              document.addEventListener("mouseup", handleMouseUp, {
+                once: true,
+              });
           }),
           onFocus: composeEventHandlers(
             children.props.onFocus,

package/src/form/checkbox/stories/checkbox.stories.mdx

@@ -1,203 +0,0 @@
-import { Meta, Canvas } from "@storybook/addon-docs";
-import { Checkbox, CheckboxGroup } from "../index";
-
-<Meta title="ds-react/form/checkbox/intro" />
-
-# Hvordan ta i bruk Checkbox
-
-```jsx
-<CheckboxGroup legend="Mollit eiusmod">
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup legend="Mollit eiusmod">
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange">Orange</Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-Label å checkbox settes her da med children
-
-## Description
-
-Man kan både sette en description på CheckboxGroup og selve checkbox
-
-```jsx
-<CheckboxGroup legend="Culpa cupidatat" description="Exercitation do labore">
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange" description="Laborum ad">
-    Orange
-  </Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup legend="Mollit eiusmod" description="Exercitation do labore">
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange" description="Laborum ad">
-      Orange
-    </Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-## Errors
-
-Feilmeldinger kan bare settes på gruppa
-
-```jsx
-<CheckboxGroup legend="Mollit eiusmod" error="Boks nr 2 må være valgt">
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup legend="Mollit eiusmod" error="Boks nr 2 må være valgt">
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange">Orange</Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-Enkelt-checkboxer tar en `boolean` error prop
-
-```jsx
-<Checkbox value="Apple" error>
-  Apple
-</Checkbox>
-```
-
-<Canvas>
-  <Checkbox value="Apple" error>
-    Apple
-  </Checkbox>
-</Canvas>
-
-## Sizing
-
-Checkboxer har default 48px høy klikkflate. Med size="small" blir klikkflaten 32px
-
-```jsx
-<CheckboxGroup
-  legend="Mollit eiusmod"
-  error="Boks nr 2 må være valgt"
-  size="small"
->
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup
-    legend="Mollit eiusmod"
-    error="Boks nr 2 må være valgt"
-    size="small"
-  >
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange" error="Boksen må være valgt">
-      Orange
-    </Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-## defaultValues
-
-```jsx
-<CheckboxGroup legend="Mollit eiusmod" defaultValue={["Orange", "Melon"]}>
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup legend="Mollit eiusmod" defaultValue={["Orange", "Melon"]}>
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange">Orange</Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-## hideLegend
-
-Ved bruk av `hideLegend` på CheckboxGroup kan man gjøre slik at legend/description bare vises for skjermlesere
-
-```jsx
-<CheckboxGroup legend="Mollit eiusmod" hideLegend>
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <CheckboxGroup legend="Mollit eiusmod" hideLegend>
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange">Orange</Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
-</Canvas>
-
-## hideLabel
-
-Ved bruk av `hideLabel` kan man lettere ta i bruk checkbox internt i eks tabeller.
-
-```jsx
-<Checkbox value="Orange" hideLabel>
-  Orange
-</Checkbox>
-```
-
-<Canvas>
-  <Checkbox value="Orange" hideLabel>
-    Orange
-  </Checkbox>
-</Canvas>
-
-## Disabled
-
-Ved bruk av `disabled` kan man både disabled enkelte checkboxer eller checkboxgruppen.
-
-NOTE: Husk at disabled bør unngås!
-
-```jsx
-<CheckboxGroup legend="Mollit eiusmod" disabled>
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-
-<CheckboxGroup legend="Mollit eiusmod">
-  <Checkbox value="Apple" disabled>Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
-```
-
-<Canvas>
-  <div>
-    <CheckboxGroup legend="Mollit eiusmod" disabled>
-      <Checkbox value="Apple">Apple</Checkbox>
-      <Checkbox value="Orange">Orange</Checkbox>
-      <Checkbox value="Melon">Melon</Checkbox>
-    </CheckboxGroup>
-    <CheckboxGroup legend="Mollit eiusmod">
-      <Checkbox value="Apple" disabled>
-        Apple
-      </Checkbox>
-      <Checkbox value="Orange">Orange</Checkbox>
-      <Checkbox value="Melon">Melon</Checkbox>
-    </CheckboxGroup>
-  </div>
-</Canvas>

package/src/form/checkbox/stories/checkbox.stories.tsx

@@ -1,109 +0,0 @@
-import React, { useState } from "react";
-import { Checkbox, CheckboxGroup } from "../../index";
-import { Meta } from "@storybook/react/types-6-0";
-import { CheckboxGroupProps } from "..";
-export default {
-  title: "ds-react/form/checkbox",
-  component: Checkbox,
-} as Meta;
-
-export const Indeterminate = () => {
-  const [checked, setChecked] = useState([true, false]);
-
-  return (
-    <>
-      <Checkbox
-        checked={checked[0] && checked[1]}
-        indeterminate={checked[0] !== checked[1]}
-        onChange={(e) => setChecked([e.target.checked, e.target.checked])}
-      >
-        Parent
-      </Checkbox>
-      <div style={{ paddingLeft: "2rem" }}>
-        <Checkbox
-          checked={checked[0]}
-          onChange={(e) => setChecked([e.target.checked, checked[1]])}
-        >
-          Child 1
-        </Checkbox>
-        <Checkbox
-          checked={checked[1]}
-          onChange={(e) => setChecked([checked[0], e.target.checked])}
-        >
-          Child 2
-        </Checkbox>
-      </div>
-    </>
-  );
-};
-
-export const All = () => {
-  const Checkboxes = (
-    props: Omit<CheckboxGroupProps, "legend" | "description" | "children">
-  ) => (
-    <CheckboxGroup
-      legend="Mollit eiusmod"
-      description="Exercitation do labore"
-      {...props}
-    >
-      <Checkbox value={1}>Apple</Checkbox>
-      <Checkbox value="Orange" description="Laborum ad">
-        Orange
-      </Checkbox>
-      <Checkbox value="Banana" description={<div>Laborum ad</div>}>
-        Banana
-      </Checkbox>
-      <Checkbox value="Melon">Melon</Checkbox>
-    </CheckboxGroup>
-  );
-
-  return (
-    <>
-      <h1>Checkbox</h1>
-      <h2>Single checkbox</h2>
-      <Checkbox value="Apple">Apple</Checkbox>
-      <h3>Desription</h3>
-      <Checkbox value={1} description="Laborum ad" defaultChecked>
-        Apple
-      </Checkbox>
-      <h3>Error</h3>
-      <Checkbox value="Apple" error>
-        Apple
-      </Checkbox>
-      <Checkbox value="Apple" error defaultChecked>
-        Orange
-      </Checkbox>
-      <h3>Hide label</h3>
-      <Checkbox value="Apple" hideLabel description="Laborum ad">
-        Apple
-      </Checkbox>
-      <h3>Disabled</h3>
-      <Checkbox value="Apple" disabled>
-        Apple
-      </Checkbox>
-      <Checkbox value="Orange" description="Laborum ad" disabled defaultChecked>
-        Orange
-      </Checkbox>
-      <h3>Indeterminate</h3>
-      <Checkbox value="Apple" indeterminate>
-        Apple
-      </Checkbox>
-      <Checkbox value="Orange" indeterminate size="small">
-        Orange
-      </Checkbox>
-
-      <h2>Checkbox group</h2>
-      <Checkboxes />
-      <h3>Error</h3>
-      <Checkboxes error="Dette er en feilmelding" />
-      <h3>Small</h3>
-      <Checkboxes size="small" />
-      <h3>Small + error</h3>
-      <Checkboxes size="small" error="Dette er en feilmelding" />
-      <h3>Default value</h3>
-      <Checkboxes defaultValue={[1, "Melon"]} />
-      <h3>Disabled</h3>
-      <Checkboxes disabled />
-    </>
-  );
-};

package/src/form/error-summary/stories/error-summary.stories.mdx

@@ -1,54 +0,0 @@
-import { Meta, Canvas } from "@storybook/addon-docs";
-import { ErrorSummary } from "../index";
-
-<Meta title="ds-react/form/errorsummary/intro" />
-
-# Hvordan ta i bruk ErrorSummary
-
-`href` på `ErrorSummary.Item` linker til id som er satt på skjema-elementer.
-
-```jsx
-<ErrorSummary heading="Eiusmod est cillum mollit pariatur deserunt">
-  <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-  <ErrorSummary.Item href="#2">
-    Tekstfeltet må ha en godkjent e-mail
-  </ErrorSummary.Item>
-</ErrorSummary>
-```
-
-<Canvas>
-  <ErrorSummary heading="Eiusmod est cillum mollit pariatur deserunt">
-    <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-    <ErrorSummary.Item href="#2">
-      Tekstfeltet må ha en godkjent e-mail
-    </ErrorSummary.Item>
-  </ErrorSummary>
-</Canvas>
-
-## Custom headingTag
-
-`headingTag` lar deg sette heading til en annen html-tag en default "h2"
-
-```jsx
-<ErrorSummary
-  heading="Eiusmod est cillum mollit pariatur deserunt"
-  headingTag="h3"
->
-  <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-  <ErrorSummary.Item href="#2">
-    Tekstfeltet må ha en godkjent e-mail
-  </ErrorSummary.Item>
-</ErrorSummary>
-```
-
-<Canvas>
-  <ErrorSummary
-    heading="Eiusmod est cillum mollit pariatur deserunt"
-    headingTag="h3"
-  >
-    <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-    <ErrorSummary.Item href="#2">
-      Tekstfeltet må ha en godkjent e-mail
-    </ErrorSummary.Item>
-  </ErrorSummary>
-</Canvas>

package/src/form/error-summary/stories/error-summary.stories.tsx

@@ -1,28 +0,0 @@
-import React from "react";
-import { Meta } from "@storybook/react/types-6-0";
-import { ErrorSummary } from "..";
-export default {
-  title: "ds-react/form/errorsummary",
-  component: ErrorSummary,
-} as Meta;
-
-export const All = () => {
-  return (
-    <>
-      <h1>Error summary</h1>
-      <ErrorSummary heading="Feiloppsummering komponent" headingTag="h4">
-        <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-        <ErrorSummary.Item href="#2">
-          Tekstfeltet må ha en godkjent e-mail
-        </ErrorSummary.Item>
-      </ErrorSummary>
-      <h2>size small</h2>
-      <ErrorSummary size="small" heading="Feiloppsummering komponent">
-        <ErrorSummary.Item href="#1">Checkbox må fylles ut</ErrorSummary.Item>
-        <ErrorSummary.Item href="#2">
-          Tekstfeltet må ha en godkjent e-mail
-        </ErrorSummary.Item>
-      </ErrorSummary>
-    </>
-  );
-};

package/src/form/radio/stories/radio.stories.mdx

@@ -1,173 +0,0 @@
-import { Meta, Canvas } from "@storybook/addon-docs";
-import { Radio, RadioGroup } from "../index";
-
-<Meta title="ds-react/form/radio/intro" />
-
-# Hvordan ta i bruk Radio
-
-```jsx
-<RadioGroup legend="Mollit eiusmod">
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup legend="Mollit eiusmod">
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange">Orange</Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-Label å Radio settes her da med children
-
-## Description
-
-Man kan både sette en description på RadioGroup og selve Radio
-
-```jsx
-<RadioGroup legend="Culpa cupidatat" description="Exercitation do labore">
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange" description="Laborum ad">
-    Orange
-  </Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup legend="Mollit eiusmod" description="Exercitation do labore">
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange" description="Laborum ad">
-      Orange
-    </Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-## Errors
-
-Feilmeldinger kan bare settes på gruppa
-
-```jsx
-<RadioGroup legend="Mollit eiusmod" error="Boks nr 2 må være valgt">
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup legend="Mollit eiusmod" error="Boks nr 2 må være valgt">
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange">Orange</Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-## Sizing
-
-Radioknapper har default 48px høy klikkflate. Med size="small" blir klikkflaten 32px
-
-```jsx
-<RadioGroup
-  legend="Mollit eiusmod"
-  error="Boks nr 2 må være valgt"
-  size="small"
->
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup
-    legend="Mollit eiusmod"
-    error="Boks nr 2 må være valgt"
-    size="small"
-  >
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange" error="Boksen må være valgt">
-      Orange
-    </Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-## defaultValue
-
-```jsx
-<RadioGroup legend="Mollit eiusmod" defaultValue="Orange">
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup legend="Mollit eiusmod" defaultValue="Orange">
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange">Orange</Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-## hideLegend
-
-Ved bruk av `hideLegend` på RadioGroup kan man gjøre slik at legend/description bare vises for skjermlesere
-
-```jsx
-<RadioGroup legend="Mollit eiusmod" hideLegend>
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <RadioGroup legend="Mollit eiusmod" hideLegend>
-    <Radio value="Apple">Apple</Radio>
-    <Radio value="Orange">Orange</Radio>
-    <Radio value="Melon">Melon</Radio>
-  </RadioGroup>
-</Canvas>
-
-## Disabled
-
-Ved bruk av `disabled` kan man både disabled enkelte Radioer eller Radiogruppen.
-
-NOTE: Husk at disabled bør unngås!
-
-```jsx
-<RadioGroup legend="Mollit eiusmod" disabled>
-  <Radio value="Apple">Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-
-<RadioGroup legend="Mollit eiusmod" >
-  <Radio value="Apple" disabled>Apple</Radio>
-  <Radio value="Orange">Orange</Radio>
-  <Radio value="Melon">Melon</Radio>
-</RadioGroup>
-```
-
-<Canvas>
-  <div>
-    <RadioGroup legend="Mollit eiusmod" disabled>
-      <Radio value="Apple">Apple</Radio>
-      <Radio value="Orange">Orange</Radio>
-      <Radio value="Melon">Melon</Radio>
-    </RadioGroup>
-    <RadioGroup legend="Mollit eiusmod">
-      <Radio value="Apple" disabled>
-        Apple
-      </Radio>
-      <Radio value="Orange">Orange</Radio>
-      <Radio value="Melon">Melon</Radio>
-    </RadioGroup>
-  </div>
-</Canvas>

package/src/form/radio/stories/radio.stories.tsx

@@ -1,51 +0,0 @@
-import React from "react";
-import { Meta } from "@storybook/react/types-6-0";
-import { RadioGroup, Radio } from "../index";
-import { RadioGroupProps } from "../RadioGroup";
-export default {
-  title: "ds-react/form/radio",
-  component: RadioGroup,
-} as Meta;
-
-export const All = () => {
-  const Radios = (props: Omit<RadioGroupProps, "legend" | "children">) => (
-    <RadioGroup
-      legend="Mollit eiusmod"
-      description={<div>"Exercitation do labore"</div>}
-      {...props}
-    >
-      <Radio value={1}>Apple</Radio>
-      <Radio value={false} description={<div>Laborum ad</div>}>
-        Orange
-      </Radio>
-      <Radio value="Melon">Melon</Radio>
-    </RadioGroup>
-  );
-
-  return (
-    <>
-      <h1>Radio group</h1>
-      <Radios />
-      <h2>Error</h2>
-      <Radios error="Dette er en feilmelding" />
-      <h2>Small</h2>
-      <Radios size="small" />
-      <h2>Small + error</h2>
-      <Radios size="small" error="Dette er en feilmelding" />
-      <h2>Default value</h2>
-      <Radios defaultValue={1} />
-      <h2>Disabled</h2>
-      <RadioGroup legend="Mollit eiusmod" description="Exercitation do labore">
-        <Radio value="Apple" disabled>
-          Apple
-        </Radio>
-        <Radio value={false} description="Laborum ad" disabled>
-          Orange
-        </Radio>
-        <Radio value="Melon">Melon</Radio>
-      </RadioGroup>
-      <h2>Disabled group</h2>
-      <Radios disabled />
-    </>
-  );
-};

package/src/form/search/search-themes.stories.tsx

@@ -1,52 +0,0 @@
-import { Meta } from "@storybook/react/types-6-0";
-import React from "react";
-import { Heading } from "../..";
-import { Search } from "..";
-
-export default {
-  title: "ds-react/form/search",
-  component: Search,
-} as Meta;
-
-export const LightTheme = () => (
-  <div
-    style={{ maxWidth: 400, display: "flex", flexDirection: "column", gap: 16 }}
-  >
-    <Heading size="xlarge">Search</Heading>
-    <Heading level="2" size="large">
-      size medium
-    </Heading>
-    <Search label="hidden label" placeholder="Søk" />
-    <Search label="hidden label" variant="secondary" defaultValue="dagpenger" />
-    <Search label="hidden label" variant="simple" placeholder="Søk" />
-    <Search label="with label" hideLabel={false} />
-
-    <Heading level="2" size="large">
-      size small
-    </Heading>
-    <Search label="hidden label" size="small" placeholder="Søk" />
-    <Search
-      label="hidden label"
-      variant="secondary"
-      size="small"
-      defaultValue="dagpenger"
-    />
-    <Search
-      label="hidden label"
-      variant="simple"
-      size="small"
-      placeholder="Søk"
-    />
-    <Search label="with label" hideLabel={false} size="small" />
-  </div>
-);
-
-export const DarkTheme = () => (
-  <div data-theme="dark">
-    <LightTheme />
-  </div>
-);
-
-DarkTheme.parameters = {
-  backgrounds: { default: "dark" },
-};