@helsenorge/designsystem-react 0.0.3-dev.8 → 1.0.0-alpha-nye-spacers-3

package/components/LinkList/componentdata.json

@@ -0,0 +1,198 @@
+{
+  "props": {
+    "children": {
+      "defaultValue": null,
+      "description": "Items in the LinkList",
+      "name": "children",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": true,
+      "type": {
+        "name": "ReactNode"
+      }
+    },
+    "className": {
+      "defaultValue": null,
+      "description": "Adds custom classes to the element.",
+      "name": "className",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "color": {
+      "defaultValue": null,
+      "description": "Changes the link list background color on hover.",
+      "name": "color",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": true,
+      "type": {
+        "name": "enum",
+        "raw": "PaletteNames",
+        "value": [
+          {
+            "value": "\"banana\""
+          },
+          {
+            "value": "\"blueberry\""
+          },
+          {
+            "value": "\"cherry\""
+          },
+          {
+            "value": "\"kiwi\""
+          },
+          {
+            "value": "\"neutral\""
+          },
+          {
+            "value": "\"plum\""
+          },
+          {
+            "value": "\"black\""
+          },
+          {
+            "value": "\"white\""
+          }
+        ]
+      }
+    },
+    "chevron": {
+      "defaultValue": null,
+      "description": "Toggles chevron icon on or off.",
+      "name": "chevron",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "bottomBorder": {
+      "defaultValue": null,
+      "description": "Toggles the bottom border of the last child element.",
+      "name": "bottomBorder",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "topBorder": {
+      "defaultValue": null,
+      "description": "Toggles the top border of the first child element.",
+      "name": "topBorder",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "size": {
+      "defaultValue": null,
+      "description": "Changes size of the LinkList.",
+      "name": "size",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "enum",
+        "raw": "\"small\" | \"medium\" | \"large\" | undefined",
+        "value": [
+          {
+            "value": "undefined"
+          },
+          {
+            "value": "\"small\""
+          },
+          {
+            "value": "\"medium\""
+          },
+          {
+            "value": "\"large\""
+          }
+        ]
+      }
+    },
+    "testId": {
+      "defaultValue": null,
+      "description": "Sets the data-testid attribute.",
+      "name": "testId",
+      "parent": {
+        "fileName": "src/components/LinkList/LinkList.tsx",
+        "name": "LinkListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/LinkList/LinkList.tsx",
+          "name": "LinkListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    }
+  }
+}

package/components/LinkList/index.d.ts

@@ -0,0 +1,3 @@
+import LinkList from './LinkList';
+export default LinkList;
+//# sourceMappingURL=index.d.ts.map

package/components/LinkList/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/LinkList/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,eAAe,QAAQ,CAAC"}

package/components/LinkList/index.js

@@ -0,0 +1,2 @@
+import{a as e}from"../../_rollupPluginBabelHelpers-d0752906.js";import{_ as r}from"../../_tslib-51c8a283.js";import t from"react";import{c as l}from"../../index-9b84fabc.js";import{a,I as i}from"../../constants-d919236e.js";import{u as o,B as s}from"../../useBreakpoint-324a9b14.js";import{u as n}from"../../useHover-037be19d.js";import m from"./styles.module.scss";import"../../useWindowSize-73b47451.js";import"../../grid-11a70eb7.js";var c=function(e){var r=e.isExtraSmall,l=e.isHovered,a=t.createElement("path",{d:"M19.171 32.951l1.409 1.42L31.031 24 20.58 13.63l-1.409 1.42 9.02 8.95z"}),i=t.createElement("path",{d:"M24.479 11.63L36.93 23.999 24.479 36.37l-1.409-1.419L33.083 25H13v-2h20.085L23.07 13.049z"}),o=t.createElement("path",{d:"M17.885 32.577l1.779 1.793 10.451-10.371L19.664 13.63l-1.779 1.793 8.644 8.576z"});return r?l?t.createElement("path",{d:"M25.98 11.103l12.977 12.896L25.98 36.897l-1.78-1.794 9.899-9.841-20.204.001v-2.526l20.204-.001-9.899-9.839z"}):o:l?i:a},d=t.forwardRef((function(d,v){var p,f=d.children,u=d.className,h=void 0===u?"":u,_=d.color,k=void 0===_?"neutral":_,b=d.icon,E=d.size,z=void 0===E?"medium":E,L=d.chevron,g=void 0!==L&&L,j=d.testId,N=d.target,H=r(d,["children","className","color","icon","size","chevron","testId","target"]),B=n(),I=B.hoverRef,S=B.isHovered,M=o(),w="small"!==z&&!(!g&&!b);return t.createElement("li",{ref:v,"data-testid":j},t.createElement("a",Object.assign({className:l(m["link-list__anchor"],m["link-list__anchor--"+k],(p={},e(p,m["link-list__anchor--small"],"small"===z),e(p,m["link-list__anchor--medium"],"medium"===z),e(p,m["link-list__anchor--large"],"large"===z),p),h),ref:I,rel:"_blank"===N?"noopener noreferrer":void 0,target:N},H),w&&b&&t.createElement("span",{className:m["link-list__icon"]},t.cloneElement(b,{size:M===s.Xs?a.XSmall:a.Small,isHovered:S})),t.createElement("span",{className:m["link-list__content"]},f),w&&g&&t.createElement("span",{className:m["link-list__chevron"]},t.createElement(i,{svgIcon:c,isHovered:S,size:a.XSmall}))))})),v=t.forwardRef((function(r,a){var i,o=r.children,s=r.className,n=void 0===s?"":s,c=r.chevron,v=void 0!==c&&c,p=r.size,f=void 0===p?"medium":p,u=r.color,h=r.topBorder,_=void 0===h||h,k=r.bottomBorder,b=void 0===k||k,E=r.testId;return t.createElement("ul",{ref:a,className:l(m["link-list"],(i={},e(i,m["link-list--hastopborder"],_),e(i,m["link-list--nobottomborder"],!b),i),n||""),"data-testid":E},t.Children.map(o,(function(e){if(e.type===d)return t.cloneElement(e,{color:u,size:f,chevron:v})})))}));v.Link=d,d.displayName="LinkList.Link";export default v;
+//# sourceMappingURL=index.js.map

package/components/LinkList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/LinkList/styles.module.scss

@@ -0,0 +1,147 @@
+@import '../../scss/_spacers.scss';
+@import '../../scss/_breakpoints.scss';
+@import '../../scss/_font-settings.scss';
+@import '../../scss/_palette.scss';
+
+.link-list {
+  list-style: none;
+  padding: 0;
+  width: inherit;
+  margin: 0;
+
+  & > :nth-child(n) {
+    border-bottom: 1px solid $neutral500;
+  }
+  &--hastopborder {
+    & > :first-child {
+      border-top: 1px solid $neutral500;
+    }
+  }
+  &--nobottomborder {
+    & > :last-child {
+      border-bottom: 0;
+    }
+  }
+
+  &__anchor {
+    display: flex;
+    min-height: 4rem;
+    text-decoration: none;
+    align-items: center;
+    color: $black;
+    cursor: pointer;
+
+    &--small {
+      padding: getSpacer(2xs) 0 getSpacer(2xs) 0;
+      font-size: $font-size-xs;
+      line-height: $lineheight-size-xs;
+    }
+    &--medium {
+      padding: getSpacer(2xs) 0 getSpacer(2xs) 0;
+      font-size: $font-size-sm;
+      line-height: $lineheight-size-sm;
+    }
+    &--large {
+      padding: getSpacer(2xs) 0 getSpacer(2xs) 0;
+      font-size: $font-size-md;
+      line-height: $lineheight-size-md;
+    }
+    @media (min-width: map-get($grid-breakpoints, md)) {
+      &--small {
+        padding-left: getSpacer(2xs);
+        padding-right: getSpacer(2xs);
+        font-size: $font-size-sm;
+        line-height: $lineheight-size-sm;
+      }
+      &--medium {
+        padding-left: getSpacer(2xs);
+        padding-right: getSpacer(2xs);
+        font-size: $font-size-md;
+        line-height: $lineheight-size-md;
+      }
+      &--large {
+        padding-left: getSpacer(2xs);
+        padding-right: getSpacer(2xs);
+        font-size: $font-size-lg;
+        line-height: $lineheight-size-lg;
+      }
+    }
+
+    &--banana {
+      &:hover,
+      &:focus {
+        background-color: $banana100;
+      }
+    }
+    &--blueberry {
+      &:hover,
+      &:focus {
+        background-color: $blueberry100;
+      }
+    }
+    &--cherry {
+      &:hover,
+      &:focus {
+        background-color: $cherry100;
+      }
+    }
+    &--kiwi {
+      &:hover,
+      &:focus {
+        background-color: $kiwi100;
+      }
+    }
+    &--neutral,
+    &--black {
+      &:hover,
+      &:focus {
+        background-color: $neutral100;
+      }
+    }
+    &--plum {
+      &:hover,
+      &:focus {
+        background-color: $plum100;
+      }
+    }
+    &--black {
+      &:hover,
+      &:focus {
+        background-color: $black;
+        color: $white;
+      }
+    }
+    &--white {
+      &:hover,
+      &:focus {
+        background-color: $neutral50;
+      }
+    }
+
+    &:focus {
+      outline: none;
+    }
+  }
+
+  &__content {
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid transparent;
+    :focus > & {
+      border-color: $black;
+    }
+  }
+
+  &__icon {
+    display: flex;
+    align-items: center;
+    margin-right: getSpacer(2xs);
+  }
+
+  &__chevron {
+    display: flex;
+    align-items: center;
+    margin-left: auto;
+    padding-left: getSpacer(2xs);
+  }
+}

package/components/LinkList/styles.module.scss.d.ts

@@ -0,0 +1,26 @@
+export type Styles = {
+  'link-list': string;
+  'link-list__anchor': string;
+  'link-list__anchor--banana': string;
+  'link-list__anchor--black': string;
+  'link-list__anchor--blueberry': string;
+  'link-list__anchor--cherry': string;
+  'link-list__anchor--kiwi': string;
+  'link-list__anchor--large': string;
+  'link-list__anchor--medium': string;
+  'link-list__anchor--neutral': string;
+  'link-list__anchor--plum': string;
+  'link-list__anchor--small': string;
+  'link-list__anchor--white': string;
+  'link-list__chevron': string;
+  'link-list__content': string;
+  'link-list__icon': string;
+  'link-list--hastopborder': string;
+  'link-list--nobottomborder': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/List/List.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface ListProps {
+    children: React.ReactNode[];
+    className?: string;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare function List(props: ListProps): JSX.Element;
+export default List;
+//# sourceMappingURL=List.d.ts.map

package/components/List/List.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/components/List/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,UAAU,SAAS;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,IAAI,CAAC,KAAK,EAAE,SAAS,eAa7B;AAED,eAAe,IAAI,CAAC"}

package/components/List/componentdata.json

@@ -0,0 +1,42 @@
+{
+  "props": {
+    "className": {
+      "defaultValue": null,
+      "description": "",
+      "name": "className",
+      "parent": {
+        "fileName": "src/components/List/List.tsx",
+        "name": "ListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/List/List.tsx",
+          "name": "ListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "testId": {
+      "defaultValue": null,
+      "description": "Sets the data-testid attribute.",
+      "name": "testId",
+      "parent": {
+        "fileName": "src/components/List/List.tsx",
+        "name": "ListProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/List/List.tsx",
+          "name": "ListProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    }
+  }
+}

package/components/List/index.d.ts

@@ -0,0 +1,3 @@
+import List from './List';
+export default List;
+//# sourceMappingURL=index.d.ts.map

package/components/List/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/List/index.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,eAAe,IAAI,CAAC"}

package/components/List/index.js

@@ -0,0 +1,2 @@
+import e from"react";import{c as t}from"../../index-9b84fabc.js";import s from"./styles.module.scss";export default function(a){var r=a.children,m=a.className,l=a.testId;return e.createElement("ul",{className:t(s.list,m),"data-testid":l},r.map((function(t,a){return e.createElement("li",{className:s.list__item,key:a},t)})))}
+//# sourceMappingURL=index.js.map

package/components/List/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/List/styles.module.scss

@@ -0,0 +1,11 @@
+@import '../../scss/_palette.scss';
+
+.list {
+  width: 100%;
+  list-style: none;
+  padding: 0 1rem 0 0.5rem;
+
+  &__item {
+    border-bottom: 1px solid $neutral600;
+  }
+}

package/components/List/styles.module.scss.d.ts

@@ -0,0 +1,10 @@
+export type Styles = {
+  list: string;
+  list__item: string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Loader/Loader.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { PaletteNames } from '../../theme/palette';
+export declare type LoaderColors = PaletteNames;
+export declare type LoaderSizes = 'tiny' | 'small' | 'medium' | 'large';
+interface LoaderProps {
+    /** Sets the color of the loader */
+    color?: LoaderColors;
+    /**	Adds custom classes to the element. */
+    className?: string;
+    /** Changes the size of the loader. */
+    size?: LoaderSizes;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+    /** Centers the loader in a container */
+    center?: boolean;
+    /** Loader is displayed with grey background covering the entire screen */
+    overlay?: boolean;
+    /**  Individual id for loading icon (aria-labelledby).  */
+    ariaLabelledById?: string;
+    /**  String that labels the current loading element  */
+    ariaLabel?: string;
+}
+declare const Loader: React.ForwardRefExoticComponent<LoaderProps & React.RefAttributes<HTMLElement>>;
+export default Loader;
+//# sourceMappingURL=Loader.d.ts.map

package/components/Loader/Loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.d.ts","sourceRoot":"","sources":["../../../src/components/Loader/Loader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGnD,oBAAY,YAAY,GAAG,YAAY,CAAC;AACxC,oBAAY,WAAW,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEhE,UAAU,WAAW;IACnB,mCAAmC;IACnC,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wCAAwC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,0EAA0E;IAC1E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,MAAM,iFA0DV,CAAC;AAEH,eAAe,MAAM,CAAC"}