@navikt/ds-react 0.19.1 → 0.19.4

package/cjs/accordion/AccordionContent.js

@@ -51,7 +51,7 @@ const AccordionContent = (0, react_1.forwardRef)((_a, ref) => {
     const CollapseComponent = context.renderContentWhenClosed
         ? react_collapse_1.Collapse
         : react_collapse_1.UnmountClosed;
-    return (react_1.default.createElement("div", Object.assign({ ref: ref, role: "region", "aria-labelledby": context.buttonId }, rest),
+    return (react_1.default.createElement("div", Object.assign({ ref: ref, "aria-labelledby": context.buttonId }, rest),
         react_1.default.createElement(CollapseComponent, { isOpened: context.open },
             react_1.default.createElement("div", { className: (0, classnames_1.default)("navds-accordion__content", className) }, children))));
 });

package/cjs/read-more/ReadMore.js

@@ -65,7 +65,6 @@ exports.ReadMore = (0, react_1.forwardRef)((_a, ref) => {
             react_1.default.createElement(ds_icons_2.ExpandFilled, { className: "navds-read-more__expand-icon navds-read-more__expand-icon--filled", "aria-hidden": true }),
             react_1.default.createElement("span", null, header)),
         react_1.default.createElement(CollapseComponent, { isOpened: isOpened },
-            react_1.default.createElement("div", { className: "navds-read-more__content" },
-                react_1.default.createElement(typography_1.BodyLong, { size: size }, children)))));
+            react_1.default.createElement(typography_1.BodyLong, { as: "div", className: "navds-read-more__content", size: size }, children))));
 });
 exports.default = exports.ReadMore;

package/esm/accordion/AccordionContent.js

@@ -23,7 +23,7 @@ const AccordionContent = forwardRef((_a, ref) => {
     const CollapseComponent = context.renderContentWhenClosed
         ? Collapse
         : UnmountClosed;
-    return (React.createElement("div", Object.assign({ ref: ref, role: "region", "aria-labelledby": context.buttonId }, rest),
+    return (React.createElement("div", Object.assign({ ref: ref, "aria-labelledby": context.buttonId }, rest),
         React.createElement(CollapseComponent, { isOpened: context.open },
             React.createElement("div", { className: cl("navds-accordion__content", className) }, children))));
 });

package/esm/accordion/AccordionContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContent.js","sourceRoot":"","sources":["../../src/accordion/AccordionContent.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAgBvD,MAAM,gBAAgB,GAAyB,UAAU,CACvD,CAAC,EAAoC,EAAE,GAAG,EAAE,EAAE;QAA7C,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,OAAW,EAAN,IAAI,cAAlC,+BAAoC,CAAF;IACjC,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEjD,IAAI,OAAO,KAAK,IAAI,EAAE;QACpB,OAAO,CAAC,KAAK,CACX,+DAA+D,CAChE,CAAC;QACF,OAAO,IAAI,CAAC;KACb;IAED,MAAM,iBAAiB,GAAG,OAAO,CAAC,uBAAuB;QACvD,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,QAAQ,qBAAkB,OAAO,CAAC,QAAQ,IAAM,IAAI;QACtE,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,OAAO,CAAC,IAAI;YACvC,6BAAK,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,IACtD,QAAQ,CACL,CACY,CAChB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"AccordionContent.js","sourceRoot":"","sources":["../../src/accordion/AccordionContent.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAgBvD,MAAM,gBAAgB,GAAyB,UAAU,CACvD,CAAC,EAAoC,EAAE,GAAG,EAAE,EAAE;QAA7C,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,OAAW,EAAN,IAAI,cAAlC,+BAAoC,CAAF;IACjC,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEjD,IAAI,OAAO,KAAK,IAAI,EAAE;QACpB,OAAO,CAAC,KAAK,CACX,+DAA+D,CAChE,CAAC;QACF,OAAO,IAAI,CAAC;KACb;IAED,MAAM,iBAAiB,GAAG,OAAO,CAAC,uBAAuB;QACvD,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,qBAAmB,OAAO,CAAC,QAAQ,IAAM,IAAI;QACxD,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,OAAO,CAAC,IAAI;YACvC,6BAAK,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,IACtD,QAAQ,CACL,CACY,CAChB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/esm/read-more/ReadMore.js

@@ -36,8 +36,7 @@ export const ReadMore = forwardRef((_a, ref) => {
             React.createElement(ExpandFilled, { className: "navds-read-more__expand-icon navds-read-more__expand-icon--filled", "aria-hidden": true }),
             React.createElement("span", null, header)),
         React.createElement(CollapseComponent, { isOpened: isOpened },
-            React.createElement("div", { className: "navds-read-more__content" },
-                React.createElement(BodyLong, { size: size }, children)))));
+            React.createElement(BodyLong, { as: "div", className: "navds-read-more__content", size: size }, children))));
 });
 export default ReadMore;
 //# sourceMappingURL=ReadMore.js.map

package/esm/read-more/ReadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReadMore.js","sourceRoot":"","sources":["../../src/read-more/ReadMore.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAkChD,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,SAAS,EACT,MAAM,EACN,uBAAuB,GAAG,KAAK,EAC/B,QAAQ,EACR,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,EACP,IAAI,GAAG,QAAQ,OAEhB,EADI,IAAI,cATT,wGAUC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,iBAAiB,GAAG,uBAAuB;QAC/C,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY,CAAC;IAEtC,OAAO,CACL;QACE,8CACE,IAAI,EAAC,QAAQ,IACT,IAAI,IACR,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,kBAAkB,EAClB,oBAAoB,IAAI,EAAE,EAC1B,SAAS,EACT;gBACE,uBAAuB,EAAE,QAAQ;gBACjC,yBAAyB,EAAE,IAAI,KAAK,OAAO;aAC5C,CACF,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,IAAI,KAAK,SAAS,EAAE;oBACtB,eAAe,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;iBACtC;gBACD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;YACf,CAAC,mBACc,QAAQ,EACvB,GAAG,EAAE,GAAG;YAER,oBAAC,MAAM,IAAC,SAAS,EAAE,8BAA8B,wBAAgB;YACjE,oBAAC,YAAY,IACX,SAAS,EACP,mEAAmE,wBAGrE;YACF,kCAAO,MAAM,CAAQ,CACd;QACT,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ;YACnC,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,oBAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,IAAG,QAAQ,CAAY,CACvC,CACY,CAChB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ReadMore.js","sourceRoot":"","sources":["../../src/read-more/ReadMore.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAkChD,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,SAAS,EACT,MAAM,EACN,uBAAuB,GAAG,KAAK,EAC/B,QAAQ,EACR,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,EACP,IAAI,GAAG,QAAQ,OAEhB,EADI,IAAI,cATT,wGAUC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,iBAAiB,GAAG,uBAAuB;QAC/C,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY,CAAC;IAEtC,OAAO,CACL;QACE,8CACE,IAAI,EAAC,QAAQ,IACT,IAAI,IACR,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,kBAAkB,EAClB,oBAAoB,IAAI,EAAE,EAC1B,SAAS,EACT;gBACE,uBAAuB,EAAE,QAAQ;gBACjC,yBAAyB,EAAE,IAAI,KAAK,OAAO;aAC5C,CACF,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,IAAI,KAAK,SAAS,EAAE;oBACtB,eAAe,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;iBACtC;gBACD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;YACf,CAAC,mBACc,QAAQ,EACvB,GAAG,EAAE,GAAG;YAER,oBAAC,MAAM,IAAC,SAAS,EAAE,8BAA8B,wBAAgB;YACjE,oBAAC,YAAY,IACX,SAAS,EACP,mEAAmE,wBAGrE;YACF,kCAAO,MAAM,CAAQ,CACd;QACT,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ;YACnC,oBAAC,QAAQ,IAAC,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,0BAA0B,EAAC,IAAI,EAAE,IAAI,IAC/D,QAAQ,CACA,CACO,CAChB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/package.json

@@ -1,7 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "0.19.1",
-  "private": false,
+  "version": "0.19.4",
   "description": "NAV designsystem react components",
   "author": "NAV Designsystem team",
   "license": "MIT",
@@ -31,14 +30,14 @@
     "docgen": "yarn ts-node ../../../scripts/docgen.ts",
     "create-package-json-pointers-to-esm": "node ../../../scripts/createPackageJsonsWithESMPointers.js",
     "clean": "rimraf cjs esm",
-    "build": "yarn run clean && tsc && tsc -p tsconfig.esm.json && yarn create-package-json-pointers-to-esm && yarn docgen",
+    "build": "yarn run clean && concurrently \"tsc\" \"tsc -p tsconfig.esm.json\" && yarn create-package-json-pointers-to-esm",
     "watch": "tsc --watch -p tsconfig.esm.json",
     "test": "jest"
   },
   "dependencies": {
     "@floating-ui/react-dom": "0.6.0",
     "@material-ui/core": "^4.12.3",
-    "@navikt/ds-icons": "^0.8.13",
+    "@navikt/ds-icons": "^0.8.15",
     "@popperjs/core": "^2.10.1",
     "@radix-ui/react-tabs": "0.1.5",
     "@radix-ui/react-toggle-group": "0.1.5",
@@ -50,29 +49,32 @@
     "uuid": "^8.3.2"
   },
   "devDependencies": {
+    "@testing-library/dom": "8.13.0",
     "@testing-library/jest-dom": "^5.16.0",
     "@testing-library/react": "^13.0.0",
     "@testing-library/user-event": "^14.0.0",
     "@types/faker": "5.5.8",
     "@types/jest": "^27.0.1",
+    "@types/node": "^17.0.35",
     "@types/react-collapse": "^5.0.1",
     "@types/react-modal": "^3.13.1",
-    "@types/styled-components": "^5.1.14",
+    "concurrently": "7.2.1",
     "copyfiles": "^2.4.1",
     "faker": "5.5.3",
     "fast-glob": "3.2.11",
     "jest": "^27.5.0",
     "react-docgen-typescript": "2.2.2",
+    "react-dom": "^18.0.0",
     "react-router-dom": "^6.3.0",
     "rimraf": "3.0.2",
-    "styled-components": "^5.3.1",
     "swr": "^1.1.2",
     "ts-jest": "^27.1.0",
-    "ts-node": "10.7.0"
+    "ts-node": "10.7.0",
+    "typescript": "^4.7.2"
   },
   "peerDependencies": {
     "@types/react": "^17.0.30 || ^18.0.0",
     "react": "^17.0.0 || ^18.0.0"
   },
-  "gitHead": "aa987b1c01408b07faa91e07ee1d36635e006bc3"
+  "gitHead": "2e87ec15192fc8009de70fd8f0b14446ddc8632d"
 }

package/src/accordion/AccordionContent.tsx

@@ -33,7 +33,7 @@ const AccordionContent: AccordionContentType = forwardRef(
       : UnmountClosed;
 
     return (
-      <div ref={ref} role="region" aria-labelledby={context.buttonId} {...rest}>
+      <div ref={ref} aria-labelledby={context.buttonId} {...rest}>
         <CollapseComponent isOpened={context.open}>
           <div className={cl("navds-accordion__content", className)}>
             {children}

package/src/accordion/accordion.stories.tsx

@@ -52,11 +52,13 @@ export const Default = (props) => {
       </Accordion.Item>
     );
   return (
-    <Accordion>
-      {[...Array(props.nItems ? props.nItems : 2)].map((_, y) => (
-        <Item key={y} />
-      ))}
-    </Accordion>
+    <div style={{ width: 500 }}>
+      <Accordion>
+        {[...Array(props.nItems ? props.nItems : 2)].map((_, y) => (
+          <Item key={y} />
+        ))}
+      </Accordion>
+    </div>
   );
 };
 
@@ -71,32 +73,36 @@ export const Controlled = () => {
   const [open2, setOpen2] = useState(false);
 
   return (
+    <div style={{ width: 500 }}>
+      <Accordion>
+        <Accordion.Item open={open}>
+          <Accordion.Header onClick={() => setOpen(!open)}>
+            Accordion header text
+          </Accordion.Header>
+          <Content />
+        </Accordion.Item>
+        <Accordion.Item open={open2}>
+          <Accordion.Header onClick={() => setOpen2(!open2)}>
+            Accordion header text
+          </Accordion.Header>
+          <Content />
+        </Accordion.Item>
+      </Accordion>
+    </div>
+  );
+};
+
+export const Uncontrolled = () => (
+  <div style={{ width: 500 }}>
     <Accordion>
-      <Accordion.Item open={open}>
-        <Accordion.Header onClick={() => setOpen(!open)}>
-          Accordion header text
-        </Accordion.Header>
+      <Accordion.Item>
+        <Accordion.Header>Accordion header text</Accordion.Header>
         <Content />
       </Accordion.Item>
-      <Accordion.Item open={open2}>
-        <Accordion.Header onClick={() => setOpen2(!open2)}>
-          Accordion header text
-        </Accordion.Header>
+      <Accordion.Item>
+        <Accordion.Header>Accordion header text</Accordion.Header>
         <Content />
       </Accordion.Item>
     </Accordion>
-  );
-};
-
-export const Uncontrolled = () => (
-  <Accordion>
-    <Accordion.Item>
-      <Accordion.Header>Accordion header text</Accordion.Header>
-      <Content />
-    </Accordion.Item>
-    <Accordion.Item>
-      <Accordion.Header>Accordion header text</Accordion.Header>
-      <Content />
-    </Accordion.Item>
-  </Accordion>
+  </div>
 );

package/src/link-panel/stories/link-panel.stories.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import styled from "styled-components";
 import { LinkPanel } from "..";
 import { Illustration } from "./illustration";
 
@@ -8,15 +7,6 @@ export default {
   component: LinkPanel,
 };
 
-const StyledLinkPanel = styled(LinkPanel)`
-  .navds-link-panel__content {
-    display: grid;
-    grid-auto-flow: column;
-    gap: var(--navds-spacing-8);
-    align-items: center;
-  }
-`;
-
 export const All = () => (
   <>
     <h1>Link panel</h1>
@@ -37,7 +27,7 @@ export const All = () => (
     </LinkPanel>
 
     <h1>Custom styling</h1>
-    <StyledLinkPanel href="#">
+    <LinkPanel href="#" className="linkpanel">
       {Illustration}
       <div>
         <LinkPanel.Title>
@@ -48,6 +38,14 @@ export const All = () => (
           magna veniam consequat. id aliquip Lorem esse
         </LinkPanel.Description>
       </div>
-    </StyledLinkPanel>
+    </LinkPanel>
+    <style>{`
+      .linkpanel .navds-link-panel__content {
+        display: grid;
+        grid-auto-flow: column;
+        gap: var(--navds-spacing-8);
+        align-items: center;
+      }
+    `}</style>
   </>
 );

package/src/read-more/ReadMore.tsx

@@ -93,9 +93,9 @@ export const ReadMore = forwardRef<HTMLButtonElement, ReadMoreProps>(
           <span>{header}</span>
         </button>
         <CollapseComponent isOpened={isOpened}>
-          <div className="navds-read-more__content">
-            <BodyLong size={size}>{children}</BodyLong>
-          </div>
+          <BodyLong as="div" className="navds-read-more__content" size={size}>
+            {children}
+          </BodyLong>
         </CollapseComponent>
       </div>
     );