@helsenorge/designsystem-react 1.0.0-beta137 → 1.0.0-beta140

package/components/Table/collapseTwoCol.scss

@@ -0,0 +1,144 @@
+.table {
+  &--collapse2col {
+    @media (max-width: map-get($grid-max-breakpoints, sm)) {
+      .table__cell-expander {
+        display: none;
+      }
+
+      .table__head {
+        display: none;
+      }
+
+      display: block;
+      clear: both;
+
+      tbody,
+      tr,
+      th,
+      td {
+        display: block;
+      }
+
+      tr {
+        clear: both;
+      }
+
+      select {
+        max-width: 100%;
+      }
+
+      th:focus {
+        outline: none;
+        background-color: $blueberry800;
+        text-decoration: underline;
+      }
+      td {
+        position: relative;
+        padding-left: 40%;
+        padding-right: 0;
+        padding-top: 0.75rem;
+        padding-bottom: 0.75rem;
+        float: left;
+        clear: both;
+        width: 100%;
+
+        &:not(.expandable-container) {
+          font-weight: 400;
+        }
+
+        /* Get data from the td-tag attribute "data-label"   and use this to populate :before content */
+        &::before {
+          content: attr(data-label);
+          position: relative;
+          top: 0;
+          left: 0;
+          width: 60%;
+          padding-right: $spacer;
+          white-space: normal;
+          display: block;
+          float: left;
+          word-wrap: break-word;
+          margin-left: -67%;
+          padding-left: 0.75rem;
+          font-weight: 400;
+        }
+      }
+
+      .table__expander-cell-mobile {
+        padding-left: 0.75rem;
+      }
+
+      .table__expander-button-mobile {
+        font-weight: 100;
+        padding-right: 1rem;
+        &:hover {
+          background-color: $blueberry50;
+        }
+        &--expanded {
+          background-color: $blueberry50;
+        }
+      }
+
+      .table__expanded-row td {
+        text-align: left;
+        padding: 0.75rem;
+      }
+
+      .table__expanded-row {
+        display: none;
+        &--expanded {
+          display: block;
+        }
+      }
+
+      .table__cell {
+        border-top: 0;
+        border-bottom: 0;
+
+        outline: 0;
+
+        &--center {
+          text-align: left;
+        }
+        &--right {
+          text-align: left;
+        }
+      }
+      .table__cell:first-child {
+        border-collapse: collapse;
+        border-top: 1px solid $neutral500;
+      }
+      .table__expanded-row {
+        .table__cell:first-child {
+          border-top: 0;
+        }
+      }
+      .table__row--expandable {
+        .table__cell:nth-child(2) {
+          border-collapse: collapse;
+          border-top: 1px solid $neutral500;
+        }
+      }
+
+      tr:last-child .table__cell:last-child {
+        border-bottom: 1px solid $neutral500;
+      }
+
+      .table__expander-cell-mobile {
+        border-bottom: 1px solid $neutral500;
+        &--expanded {
+          border-bottom: 0;
+        }
+      }
+
+      .table__row--expandable {
+        &:focus-within {
+          outline: none;
+        }
+      }
+      .table__expanded-row-button {
+        display: none;
+      }
+    }
+  }
+}

package/components/Table/componentdata.json

@@ -0,0 +1,137 @@
+{
+  "props": {
+    "expandable": {
+      "defaultValue": null,
+      "description": "Sets if expanded row can be expanded",
+      "name": "expandable",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "expanded": {
+      "defaultValue": null,
+      "description": "Sets if expanded row is expanded",
+      "name": "expanded",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "onClick": {
+      "defaultValue": null,
+      "description": "When hide/show button for expanded row is clicked.",
+      "name": "onClick",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "(() => void)"
+      }
+    },
+    "hideDetailsText": {
+      "defaultValue": null,
+      "description": "Text for expanded row hide button.",
+      "name": "hideDetailsText",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "showDetailsText": {
+      "defaultValue": null,
+      "description": "Text for expanded row show button.",
+      "name": "showDetailsText",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "className": {
+      "defaultValue": null,
+      "description": "Adds custom classes to the element.",
+      "name": "className",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "children": {
+      "defaultValue": null,
+      "description": "Sets the cells of the table row element.",
+      "name": "children",
+      "parent": {
+        "fileName": "src/components/Table/TableRow.tsx",
+        "name": "Props"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Table/TableRow.tsx",
+          "name": "Props"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "ReactNode"
+      }
+    }
+  }
+}

package/components/Table/index.d.ts

@@ -0,0 +1,11 @@
+import { Table } from './Table';
+export { TableBody } from './TableBody';
+export { TableCell, TextAlign } from './TableCell';
+export { TableExpandedRow } from './TableExpandedRow';
+export { TableExpanderCell } from './TableExpanderCell';
+export { TableHead, HeaderCategory } from './TableHead';
+export { TableHeadCell, SortDirection } from './TableHeadCell';
+export { TableRow } from './TableRow';
+export * from './Table';
+export default Table;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,cAAc,SAAS,CAAC;AAExB,eAAe,KAAK,CAAC"}

package/components/Table/index.js

@@ -0,0 +1,2 @@
+import{d as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import o from"react";import{c as r}from"../../index-d1c0552c.js";import s from"./styles.module.scss";import{A as t}from"../../constants-dbdea596.js";export{T as TableBody}from"../../TableBody-eac2c23b.js";export{T as TableCell,a as TextAlign}from"../../TableCell-cc644eb5.js";export{T as TableExpandedRow}from"../../TableExpandedRow-44b09912.js";export{T as TableExpanderCell}from"../../TableExpanderCell-015d3db2.js";export{H as HeaderCategory,T as TableHead}from"../../TableHead-5ed58948.js";export{S as SortDirection,T as TableHeadCell}from"../../TableHeadCell-84651910.js";export{T as TableRow}from"../../TableRow-19db3001.js";import"../../Button-78f848e6.js";import"../../_tslib-b219470a.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";import"../../Loader-06293a27.js";import"../Loader/styles.module.scss";import"../../useHover-18479690.js";import"../../useBreakpoint-a74f5af5.js";import"../Button/styles.module.scss";import"../../ChevronUp-dfafe27b.js";import"../../ChevronDown-2b3daace.js";import"../../ArrowUp-e7787d9c.js";import"../../ArrowDown-88b2c27a.js";var l;!function(e){e.horizontalscroll="horizontalscroll",e.block="block"}(l||(l={}));var d=function(a){var d=a.id,i=a.testId,p=a.className,m=a.children,c=a.smallViewportVariant,b=void 0===c?l.block:c,n=r(s.table,e({},s["table--collapse2col"],b===l.block),p);return o.createElement("table",{className:n,id:d,"data-testid":i,"data-analyticsid":t.Table},m)};export{l as SmallViewportVariant,d as Table,d as default};
+//# sourceMappingURL=index.js.map

package/components/Table/index.js.map

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

package/components/Table/styles.module.scss

@@ -0,0 +1,136 @@
+@import '../../scss/_spacers.scss';
+@import '../../scss/_breakpoints.scss';
+@import '../../scss/_palette.scss';
+@import '../../scss/_grid.scss';
+@import '../../scss/_font-settings.scss';
+
+/* fix outline for Safari */
+table tbody tr {
+  outline: 3px solid transparent;
+}
+
+.table {
+  width: 100%;
+  border-collapse: collapse;
+
+  &__expander-cell-mobile {
+    display: none;
+  }
+}
+
+.table__head {
+  background: $blueberry50;
+  &--normal {
+    background: $neutral50;
+  }
+  &--transparent {
+    background: transparent;
+  }
+
+  &--sortable {
+    background: $blueberry50;
+  }
+
+  @media (min-width: map-get($grid-breakpoints, lg)) {
+    height: 6.125rem;
+  }
+}
+
+.table__head-cell {
+  height: 3.625rem;
+  font-size: $font-size-sm;
+  line-height: 1.5rem;
+  text-align: left;
+  vertical-align: bottom;
+  font-weight: 200;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid $neutral500;
+
+  &--sortable:hover {
+    background-color: $blueberry100;
+    cursor: pointer;
+  }
+  &--sortable:focus {
+    outline: 3px solid $black;
+  }
+
+  &--sorted {
+    text-decoration: underline;
+    text-decoration-thickness: 1px;
+    text-underline-offset: 0.3125rem;
+  }
+  @media (min-width: map-get($grid-breakpoints, lg)) {
+    padding: 1rem;
+    height: 5.5rem;
+    font-size: $font-size-md;
+    line-height: 1.75rem;
+    font-weight: 200;
+  }
+}
+
+.table__head-cell-sort-icon-wrapper {
+  min-height: 2rem;
+}
+
+.table__cell {
+  height: 2, 375;
+  font-size: $font-size-xs;
+  line-height: 1.5rem;
+  padding: 0.5rem 0.75rem;
+  text-align: left;
+  border: 1px solid $neutral500;
+
+  &--center {
+    text-align: center;
+  }
+  &--right {
+    text-align: right;
+  }
+  &--nowrap {
+    white-space: nowrap;
+  }
+
+  @media (min-width: map-get($grid-breakpoints, lg)) {
+    padding: 1rem;
+    height: 3.625rem;
+    font-size: $font-size-sm;
+    line-height: 1.75rem;
+  }
+}
+
+.table__cell-expander {
+  text-align: center;
+  width: min-content;
+  padding: 0px;
+  vertical-align: middle;
+}
+
+.table__row--expandable {
+  &--selected {
+    background: $neutral100;
+  }
+  &:hover {
+    cursor: pointer;
+    background: $neutral100;
+  }
+  &:focus-within {
+    outline: 3px solid $black;
+  }
+}
+.table__expanded-row {
+  display: none;
+  &--expanded {
+    display: table-row;
+  }
+
+  &-container {
+    padding: 0.5rem;
+    @media (min-width: map-get($grid-breakpoints, lg)) {
+      &--open {
+        border-bottom: 1px solid $neutral100;
+      }
+    }
+  }
+}
+
+@import 'collapseTwoCol.scss';

package/components/Tag/index.js

@@ -1,2 +1,2 @@
-import{d as o}from"../../_rollupPluginBabelHelpers-0f007973.js";import t from"react";import{c as a}from"../../index-d1c0552c.js";import{I as e}from"../../Icon-91bb7737.js";import{A as r,I as n}from"../../constants-1371e04f.js";import{p as c}from"../../palette-f206f488.js";import s from"./styles.module.scss";import{u as i}from"../../useHover-b995a0e6.js";import{U as m}from"../../Undo-d7e73ddf.js";import{X as l}from"../../X-b4f72c96.js";import"../../_tslib-b219470a.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";var d,u,f;!function(o){o.medium="medium",o.large="large"}(d||(d={})),function(o){o.remove="remove",o.undo="undo"}(u||(u={})),function(o){o.normal="normal",o.oncolor="oncolor",o.emphasised="emphasised"}(f||(f={}));var p=function(o){var d=o.children,u=o.size,f=o.color,p=o.variant,v=o.action,g=o.onClick,b=o.testId,j=i(),I=j.hoverRef,h=j.isHovered,y=a(s.tag,s["tag--".concat(u)],s["tag--".concat(v)],s["tag--has-action"],"remove"===v&&[s["tag--".concat(f)],s["tag--".concat(p)]]);return t.createElement("button",{className:y,onClick:g,ref:I,type:"button","data-testid":b,"data-analyticsid":r.Tag},d,t.createElement(e,{svgIcon:function(){switch(v){case"remove":return l;case"undo":return m}}(),size:n.XXSmall,color:c["".concat("undo"===v?"blueberry":f,"800")],isHovered:h}))},v=function(i){var m=i.children,l=i.size,u=void 0===l?d.medium:l,f=i.color,v=void 0===f?"blueberry":f,g=i.svgIcon,b=i.variant,j=void 0===b?"normal":b,I=i.action,h=i.onClick,y=i.testId,z=a(s.tag,s["tag--".concat(u)],s["tag--".concat(v)],s["tag--".concat(j)],o({},s["tag--has-icon"],g));return I&&h?t.createElement(p,{size:u,color:v,variant:j,action:I,onClick:h,testId:y},m):t.createElement("span",{className:z,"data-testid":y,"data-analyticsid":r.Tag},g&&t.createElement(e,{svgIcon:g,size:n.XXSmall,color:c["".concat(v,"800")],className:s.tag__icon}),m)};export{u as TagAction,d as TagSize,f as TagVariant,v as default};
+import{d as o}from"../../_rollupPluginBabelHelpers-0f007973.js";import t from"react";import{c as a}from"../../index-d1c0552c.js";import{I as e}from"../../Icon-d69d65b3.js";import{A as r,I as c}from"../../constants-dbdea596.js";import{p as n}from"../../palette-f206f488.js";import s from"./styles.module.scss";import{u as i}from"../../useHover-18479690.js";import{U as m}from"../../Undo-cc42e7d0.js";import{X as l}from"../../X-867957f2.js";import"../../_tslib-b219470a.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";var d,u,f;!function(o){o.medium="medium",o.large="large"}(d||(d={})),function(o){o.remove="remove",o.undo="undo"}(u||(u={})),function(o){o.normal="normal",o.oncolor="oncolor",o.emphasised="emphasised"}(f||(f={}));var p=function(o){var d=o.children,u=o.size,f=o.color,p=o.variant,v=o.action,g=o.onClick,b=o.testId,j=i(),I=j.hoverRef,h=j.isHovered,y=a(s.tag,s["tag--".concat(u)],s["tag--".concat(v)],s["tag--has-action"],"remove"===v&&[s["tag--".concat(f)],s["tag--".concat(p)]]);return t.createElement("button",{className:y,onClick:g,ref:I,type:"button","data-testid":b,"data-analyticsid":r.Tag},d,t.createElement(e,{svgIcon:function(){switch(v){case"remove":return l;case"undo":return m}}(),size:c.XXSmall,color:n["".concat("undo"===v?"blueberry":f,"800")],isHovered:h}))},v=function(i){var m=i.children,l=i.size,u=void 0===l?d.medium:l,f=i.color,v=void 0===f?"blueberry":f,g=i.svgIcon,b=i.variant,j=void 0===b?"normal":b,I=i.action,h=i.onClick,y=i.testId,z=a(s.tag,s["tag--".concat(u)],s["tag--".concat(v)],s["tag--".concat(j)],o({},s["tag--has-icon"],g));return I&&h?t.createElement(p,{size:u,color:v,variant:j,action:I,onClick:h,testId:y},m):t.createElement("span",{className:z,"data-testid":y,"data-analyticsid":r.Tag},g&&t.createElement(e,{svgIcon:g,size:c.XXSmall,color:n["".concat(v,"800")],className:s.tag__icon}),m)};export{u as TagAction,d as TagSize,f as TagVariant,v as default};
 //# sourceMappingURL=index.js.map

package/components/TagList/index.js

@@ -1,2 +1,2 @@
-import t from"react";import a from"./styles.module.scss";import{A as s}from"../../constants-1371e04f.js";var e=function(e){var r=e.children,i=e.testId;return t.createElement("div",{className:a["tag-list"],"data-testid":i,"data-analyticsid":s.TagList},r)};export{e as default};
+import t from"react";import a from"./styles.module.scss";import{A as s}from"../../constants-dbdea596.js";var e=function(e){var r=e.children,d=e.testId;return t.createElement("div",{className:a["tag-list"],"data-testid":d,"data-analyticsid":s.TagList},r)};export{e as default};
 //# sourceMappingURL=index.js.map

package/components/Textarea/Textarea.d.ts

@@ -7,6 +7,8 @@ interface TextareaProps extends HTMLTextareaProps {
     maxCharacters?: number;
     /** The text is displayed in the end of the text-counter */
     maxText?: string;
+    /** Width of textarea in characters (approximate) */
+    width?: number;
     /** Sets the data-testid attribute. */
     testId?: string;
     /** If true, the component will have a bottom margin. */

package/components/Textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAe,MAAM,iBAAiB,CAAC;AAG3E,UAAU,aAAc,SAAQ,iBAAiB;IAC/C,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC7B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACtC;AAED,QAAA,MAAM,QAAQ,2FAyHZ,CAAC;AAEH,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAe,MAAM,iBAAiB,CAAC;AAI3E,UAAU,aAAc,SAAQ,iBAAiB;IAC/C,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC7B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACtC;AAUD,QAAA,MAAM,QAAQ,2FA4HZ,CAAC;AAEH,eAAe,QAAQ,CAAC"}

package/components/Textarea/componentdata.json

@@ -57,6 +57,25 @@
         "name": "string"
       }
     },
+    "width": {
+      "defaultValue": null,
+      "description": "Width of textarea in characters (approximate)",
+      "name": "width",
+      "parent": {
+        "fileName": "src/components/Textarea/Textarea.tsx",
+        "name": "TextareaProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Textarea/Textarea.tsx",
+          "name": "TextareaProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "number"
+      }
+    },
     "testId": {
       "defaultValue": null,
       "description": "Sets the data-testid attribute.",

package/components/Textarea/index.js

@@ -1,2 +1,2 @@
-export{T as default}from"../../Textarea-74180432.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"../../_tslib-b219470a.js";import"react";import"../../index-d1c0552c.js";import"./styles.module.scss";import"../../constants-1371e04f.js";import"../../uuid-11037462.js";
+export{T as default}from"../../Textarea-56a24cb9.js";import"../../_rollupPluginBabelHelpers-0f007973.js";import"../../_tslib-b219470a.js";import"react";import"../../index-d1c0552c.js";import"./styles.module.scss";import"../../constants-dbdea596.js";import"../../uuid-11037462.js";import"../../Input-9ccf3867.js";import"../../Icon-d69d65b3.js";import"../../useUuid-3b1e73f2.js";import"../../color-e7d082c1.js";import"../../index-d1c9177a.js";import"../../palette-f206f488.js";import"../../grid-c105cad1.js";import"../../useBreakpoint-a74f5af5.js";import"../Input/styles.module.scss";
 //# sourceMappingURL=index.js.map

package/components/Tile/Tile.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { HTMLAnchorProps } from '../../constants';
 import { TitleTags } from './../Title/Title';
+export declare type TileTags = 'button' | 'a';
 interface TileProps extends HTMLAnchorProps {
     /** Adds custom classes to the element. */
     className?: string;
@@ -16,6 +17,8 @@ interface TileProps extends HTMLAnchorProps {
     fixed?: boolean;
     /** Called when the tile is clicked on. */
     onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    /** HTML markup for tile. Default: a */
+    htmlMarkup?: TileTags;
     /** Sets the data-testid attribute. */
     testId?: string;
 }

package/components/Tile/Tile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../src/components/Tile/Tile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,EAAe,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAK7C,UAAU,SAAU,SAAQ,eAAe;IACzC,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,sDAAsD;IACtD,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,yBAAyB,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACvH,KAAK,EAAE,KAAK,CAAC,yBAAyB,CAAC,cAAc,GAAG,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC;CAClG;AAqBD,eAAO,MAAM,IAAI,cAqCC,CAAC;AAInB,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../src/components/Tile/Tile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAe,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAM7C,oBAAY,QAAQ,GAAG,QAAQ,GAAG,GAAG,CAAC;AAEtC,UAAU,SAAU,SAAQ,eAAe;IACzC,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,sDAAsD;IACtD,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,uCAAuC;IACvC,UAAU,CAAC,EAAE,QAAQ,CAAC;IACtB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,yBAAyB,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACvH,KAAK,EAAE,KAAK,CAAC,yBAAyB,CAAC,cAAc,GAAG,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC;CAClG;AAqBD,eAAO,MAAM,IAAI,cAuDC,CAAC;AAInB,eAAe,IAAI,CAAC"}

package/components/Tile/componentdata.json

@@ -133,6 +133,37 @@
         "name": "((e?: MouseEvent<HTMLElement, MouseEvent>) => void) | undefined"
       }
     },
+    "htmlMarkup": {
+      "defaultValue": null,
+      "description": "HTML markup for tile. Default: a",
+      "name": "htmlMarkup",
+      "parent": {
+        "fileName": "src/components/Tile/Tile.tsx",
+        "name": "TileProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Tile/Tile.tsx",
+          "name": "TileProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "enum",
+        "raw": "TileTags | undefined",
+        "value": [
+          {
+            "value": "undefined"
+          },
+          {
+            "value": "\"button\""
+          },
+          {
+            "value": "\"a\""
+          }
+        ]
+      }
+    },
     "testId": {
       "defaultValue": null,
       "description": "Sets the data-testid attribute.",

package/components/Tile/index.js

@@ -1,2 +1,2 @@
-import{d as e,_ as t}from"../../_rollupPluginBabelHelpers-0f007973.js";import{_ as i}from"../../_tslib-b219470a.js";import r,{useState as l}from"react";import{c as o}from"../../index-d1c0552c.js";import{A as a,I as s}from"../../constants-1371e04f.js";import"../../Icon-91bb7737.js";import n from"./styles.module.scss";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";var c=r.forwardRef((function(t,i){var l,a=t.children,s=t.className,c=t.htmlMarkup,m=void 0===c?"span":c,d=t.highlighted,p=t.compact,u=o(n.tile__title,(e(l={},n["tile__title--highlighted"],d),e(l,n["tile__title--compact"],p),l),s),f=m;return r.createElement(f,{className:u,ref:i},a)})),m=r.forwardRef((function(c,m){var d,p=c.icon,u=c.title,f=c.className,h=void 0===f?"":f,g=c.description,_=c.fixed,v=void 0!==_&&_,b=c.highlighted,j=void 0!==b&&b,E=c.testId,N=i(c,["icon","title","className","description","fixed","highlighted","testId"]),w=l(!1),x=t(w,2),I=x[0],M=x[1],k=!g,y=o(n.tile,(e(d={},n["tile--fixed"],v),e(d,n["tile--compact"],k),e(d,n["tile--highlighted"],j),d),h),B=o(n["title-wrapper"],e({},n["title-wrapper--compact"],k));return r.createElement("a",Object.assign({ref:m,className:y,onMouseEnter:function(){return M(!0)},onMouseLeave:function(){return M(!1)},onFocus:function(){return M(!0)},onBlur:function(){return M(!1)},"data-testid":E,"data-analyticsid":a.Tile,rel:"_blank"===c.target?"noopener noreferrer":c.rel},N),r.createElement("div",{className:B},r.cloneElement(p,{size:s.Medium,isHovered:I,color:j?"white":"black"}),r.cloneElement(u,{highlighted:j,compact:k})),g?r.createElement("p",{className:n.tile__description},g):null)}));m.Title=c;export{m as Tile,m as default};
+import{d as e}from"../../_rollupPluginBabelHelpers-0f007973.js";import{_ as t}from"../../_tslib-b219470a.js";import i from"react";import{c as r}from"../../index-d1c0552c.js";import{A as a,I as l}from"../../constants-dbdea596.js";import"../../Icon-d69d65b3.js";import o from"./styles.module.scss";import{u as s}from"../../useHover-18479690.js";import"../../useUuid-3b1e73f2.js";import"../../uuid-11037462.js";var n=i.forwardRef((function(t,a){var l,s=t.children,n=t.className,c=t.htmlMarkup,m=void 0===c?"span":c,d=t.highlighted,p=t.compact,u=r(o.tile__title,(e(l={},o["tile__title--highlighted"],d),e(l,o["tile__title--compact"],p),l),n),f=m;return i.createElement(f,{className:u,ref:a},s)})),c=i.forwardRef((function(n,c){var m,d,p=n.icon,u=n.title,f=n.className,h=void 0===f?"":f,g=n.description,b=n.fixed,v=void 0!==b&&b,_=n.highlighted,j=void 0!==_&&_,E=n.testId,N=n.htmlMarkup,k=void 0===N?"a":N,w=t(n,["icon","title","className","description","fixed","highlighted","testId","htmlMarkup"]),x=s(c),H=x.hoverRef,I=x.isHovered,M=!g,y=r(o.tile,(e(m={},o["tile--fixed"],v),e(m,o["tile--compact"],M),e(m,o["tile--highlighted"],j),e(m,o["tile--button"],"button"===k),m),h),O=r(o["title-wrapper"],e({},o["title-wrapper--compact"],M)),R=function(){return i.createElement(i.Fragment,null,i.createElement("div",{className:O},i.cloneElement(p,{size:l.Medium,isHovered:I,color:j?"white":"black"}),i.cloneElement(u,{highlighted:j,compact:M})),g?i.createElement("p",{className:o.tile__description},g):null)},F=Object.assign((e(d={className:y},"data-testid",E),e(d,"data-analyticsid",a.Tile),d),w);return i.createElement(i.Fragment,null,"a"===k&&i.createElement("a",Object.assign({ref:H,rel:"_blank"===n.target?"noopener noreferrer":n.rel},F),R()),"button"===k&&i.createElement("button",Object.assign({ref:H,type:"button"},F),R()))}));c.Title=n;export{c as Tile,c as default};
 //# sourceMappingURL=index.js.map

package/components/Tile/styles.module.scss

@@ -24,7 +24,7 @@
   $tile: &;
 
   display: flex;
-  width: 'inherit';
+  width: inherit;
   padding: 1.5rem 2rem 2rem 1rem;
   flex-direction: column;
   justify-content: flex-start;
@@ -38,6 +38,10 @@
     border: 1px solid $black;
   }
 
+  &--button {
+    border: none;
+  }
+
   &--fixed {
     min-width: 15rem;
     max-width: 20rem;

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

@@ -4,6 +4,7 @@ export type Styles = {
   tile__title: string;
   'tile__title--compact': string;
   'tile__title--highlighted': string;
+  'tile--button': string;
   'tile--compact': string;
   'tile--fixed': string;
   'tile--highlighted': string;

package/components/Title/Title.d.ts

@@ -16,11 +16,11 @@ interface TitleProps {
     /** Sets the data-testid attribute. */
     testId?: string;
 }
+export declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttributes<HTMLHeadingElement>>;
 export interface TitleMargin {
     marginTop: number;
     marginBottom: number;
 }
 export declare const instanceOfTitleMargin: (margin: any) => margin is TitleMargin;
-declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttributes<HTMLHeadingElement>>;
 export default Title;
 //# sourceMappingURL=Title.d.ts.map

package/components/Title/Title.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Title.d.ts","sourceRoot":"","sources":["../../../src/components/Title/Title.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,oBAAY,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAClE,oBAAY,gBAAgB,GAAG,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAErG,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,qCAAqC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,mDAAmD;IACnD,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,2CAA2C;IAC3C,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,qBAAqB,WAAY,GAAG,0BAEhD,CAAC;AAEF,QAAA,MAAM,KAAK,uFAyBT,CAAC;AAEH,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Title.d.ts","sourceRoot":"","sources":["../../../src/components/Title/Title.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,oBAAY,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAClE,oBAAY,gBAAgB,GAAG,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAErG,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,qCAAqC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,mDAAmD;IACnD,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,2CAA2C;IAC3C,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,KAAK,uFAyBhB,CAAC;AAEH,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,qBAAqB,WAAY,GAAG,0BAEhD,CAAC;AAEF,eAAe,KAAK,CAAC"}