@helsenorge/designsystem-react 1.0.0-beta.6 → 1.0.0-beta100

package/components/RadioButton/styles.module.scss

@@ -0,0 +1,236 @@
+@import '../../scss/_spacers.scss';
+@import '../../scss/_breakpoints.scss';
+@import '../../scss/_palette.scss';
+@import '../../scss/font-settings.scss';
+
+.radio-button-errors {
+  font-size: $font-size-sm;
+  font-weight: 600;
+  color: $cherry500;
+  margin-top: 0;
+}
+
+.radio-button-wrapper {
+  cursor: pointer;
+  margin: getSpacer(s) 0;
+
+  &--with-error {
+    padding: getSpacer(s) getSpacer(xs) getSpacer(m);
+    background-color: $cherry100;
+    margin-left: -0.75rem;
+    border-left: 0.25rem solid $cherry500;
+
+    @media (min-width: map-get($grid-breakpoints, md)) {
+      padding: getSpacer(s) getSpacer(m) getSpacer(l);
+    }
+  }
+
+  &--with-error#{&}--bigform {
+    padding: getSpacer(m) getSpacer(m);
+  }
+
+  &--bigform {
+    margin: getSpacer(xs) 0 getSpacer(xs) 0;
+  }
+}
+
+.radio-button-wrapper:first-of-type {
+  margin-top: 0;
+}
+
+.radio-button-wrapper:last-of-type {
+  margin-bottom: 0;
+}
+
+.radio-button-label {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: $font-size-sm;
+
+  @media (min-width: map-get($grid-breakpoints, md)) {
+    font-size: $font-size-md;
+  }
+
+  &--on-dark {
+    color: $white;
+  }
+
+  &--invalid {
+    color: $black;
+  }
+
+  &--disabled {
+    cursor: default;
+    color: $neutral400;
+  }
+
+  &--bigform {
+    padding: getSpacer(s);
+    background-color: $neutral50;
+  }
+
+  &--bigform#{&}--on-blueberry {
+    background-color: $blueberry50;
+  }
+
+  &--bigform#{&}--on-dark {
+    background-color: $blueberry800;
+  }
+
+  &--bigform#{&}--invalid {
+    background-color: $white;
+  }
+
+  @media (min-width: map-get($grid-breakpoints, md)) {
+    &--bigform {
+      padding: 1.68rem getSpacer(l);
+    }
+  }
+}
+
+.radio-button {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -o-appearance: none;
+
+  cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 10rem;
+  margin: 0 getSpacer(s) 0 0;
+  height: 1.5rem;
+  width: 1.5rem;
+  min-width: auto !important;
+  min-height: auto !important;
+  color: $neutral700;
+  box-shadow: 0 0 0 getSpacer(3xs);
+
+  &:checked {
+    color: $blueberry500;
+
+    &:hover {
+      background-color: $blueberry50;
+    }
+  }
+
+  &:focus {
+    box-shadow: 0 0 0 getSpacer(2xs);
+    color: $black;
+  }
+
+  &:hover {
+    box-shadow: 0 0 0 getSpacer(2xs);
+    background-color: $neutral100;
+  }
+
+  :active > & {
+    box-shadow: 0 0 0 getSpacer(2xs);
+    color: $black;
+  }
+
+  &--on-blueberry {
+    color: $blueberry500;
+
+    :hover > & {
+      background-color: $blueberry100;
+    }
+  }
+
+  &--on-dark {
+    color: $neutral200;
+
+    &:hover {
+      background-color: $inverted-hover;
+      box-shadow: 0 0 0 getSpacer(2xs);
+    }
+
+    &:checked {
+      color: $blueberry200;
+
+      &:hover {
+        background-color: $inverted-hover;
+      }
+    }
+
+    :active > & {
+      box-shadow: 0 0 0 getSpacer(2xs);
+      color: $white;
+    }
+
+    &:focus {
+      color: $white;
+    }
+  }
+
+  &--invalid {
+    color: $cherry500;
+
+    &:hover {
+      background-color: $cherry100;
+    }
+
+    &:checked {
+      color: $cherry500;
+
+      &:hover {
+        background-color: $cherry100;
+      }
+    }
+
+    &:active {
+      color: $black;
+    }
+
+    &:focus {
+      color: $black;
+    }
+  }
+
+  &--disabled {
+    cursor: default;
+
+    color: $neutral400;
+    &:checked {
+      color: $neutral400;
+
+      &:hover {
+        box-shadow: 0 0 0 getSpacer(3xs);
+        background-color: transparent;
+      }
+    }
+    &:hover {
+      box-shadow: 0 0 0 getSpacer(3xs);
+      background-color: transparent;
+    }
+
+    &:active {
+      color: $neutral400;
+    }
+  }
+
+  // :before er dot i RadioButton
+  &:checked::before {
+    content: '';
+    display: flex;
+    background-color: $blueberry500;
+    width: 0.75rem;
+    height: 0.75rem;
+    border-radius: 10rem;
+  }
+
+  &--on-dark:checked::before {
+    background-color: $blueberry200;
+  }
+
+  &--disabled:checked::before {
+    box-shadow: 0 0 0 0;
+    background-color: $neutral400;
+    color: $neutral400;
+  }
+
+  &--invalid:checked::before {
+    background-color: $cherry500;
+  }
+}

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

@@ -0,0 +1,23 @@
+export type Styles = {
+  'radio-button': string;
+  'radio-button--disabled': string;
+  'radio-button--invalid': string;
+  'radio-button--on-blueberry': string;
+  'radio-button--on-dark': string;
+  'radio-button-errors': string;
+  'radio-button-label': string;
+  'radio-button-label--bigform': string;
+  'radio-button-label--disabled': string;
+  'radio-button-label--invalid': string;
+  'radio-button-label--on-blueberry': string;
+  'radio-button-label--on-dark': string;
+  'radio-button-wrapper': string;
+  'radio-button-wrapper--bigform': string;
+  'radio-button-wrapper--with-error': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Slider/Slider.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+interface SliderProps {
+    /**	Sets the title of the slider. */
+    title?: string;
+    /** Adds the left hand label to the element. */
+    labelLeft?: string;
+    /** Adds the right hand label to the element. */
+    labelRight?: string;
+    /**	Decides the number of steps for each movement of the slider. */
+    step?: number;
+    /** Disables the slider element. */
+    disabled?: boolean;
+    /** Function to be called when the value state has changed. */
+    onChange?: (value: number) => void;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLElement>>;
+export default Slider;
+//# sourceMappingURL=Slider.d.ts.map

package/components/Slider/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAsB3D,UAAU,WAAW;IACnB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,MAAM,iFA+IjB,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/components/Slider/SliderUtils.d.ts

@@ -0,0 +1,41 @@
+/// <reference types="react" />
+/** Stopper MouseEvent eller TouchEvent parameter e som sendes inn fra å nå videre.*/
+export declare const stopEvent: (e: MouseEvent | TouchEvent | import("react").MouseEvent<{}, MouseEvent> | import("react").TouchEvent<{}>) => boolean;
+/** Henter ut x posisjon til MouseEvent eller TouchEvent e */
+export declare const getMousePosition: (e: MouseEvent | TouchEvent | import("react").MouseEvent<{}, MouseEvent> | import("react").TouchEvent<{}>) => number;
+/** Henter ut width basert på viewport posisjon til parameter elementet el som sendes inn */
+export declare const getElementWidth: (el: HTMLDivElement | null) => number;
+/** Returnerer en boolean på om innsendte event e er en TouchEvent */
+export declare const isTouchEvent: (e: MouseEvent | TouchEvent | import("react").MouseEvent<{}, MouseEvent> | import("react").TouchEvent<{}>) => boolean;
+/** Kalkulerer x posisjonen til slideren basert på value som sendes inn,
+ *  trackerWidth - bredden til trackeren, sliderWidth - bredden på slideren,
+ *  og min og max verdier som er satt på slider komponentet. */
+export declare const calculateSliderPositionBasedOnValue: (value: number, trackerWidth: number, sliderWidth: number, min: number, max: number) => number;
+/** Kalkulerer verdi basert på sliderPosition som sendes inn,
+ *  trackerWidth - bredden til trackeren, sliderWidth - bredden på slideren,
+ *  og min og max verdier som er satt på slider komponentet. */
+export declare const calculateValueBasedOnSliderPosition: (sliderPosition: number, trackerWidth: number, sliderWidth: number, step: number, min: number, max: number) => number;
+/** Kalkulerer modifisert value basert på step parameteret,
+ * med hensyn til max verdi til slideren.
+ * Med en step på 10 vil da value gå fra 0 til 10 til 20 osv. */
+export declare const alignValue: (value: number, step: number, max: number) => number;
+/** Kalkulerer ny x posisjon til slider basert på innsendt differanse diff,
+ *  nåværende sliderXPos, bredden til tracker - TrackerWidth og bredden til
+ *  slider - sliderWidth. */
+export declare const calculateChangeOfPosition: (diff: number, trackerWidth: number, sliderWidth: number, sliderXPos: number) => number;
+/** Kalkulerer posisjon til slider basert på xPos, nåværende sliderELement og
+ *  bredden til slider - sliderWidth */
+export declare const calculateSliderTranslate: (xPos: number, sliderElement: HTMLDivElement | null, sliderWidth: number, cb: (a: number) => void) => void;
+/** Legger til mousemove og mouseup event listeners,
+ *  basert på moveMouseEvent og mouseUpEvent eventene */
+export declare const addMouseListeners: (moveMouseEvent: (evt: MouseEvent) => void, mouseUpEvent: (evt: MouseEvent) => void) => void;
+/** Fjerner mousemove og mouseup event listeners,
+ *  basert på moveMouseEvent og mouseUpEvent eventene */
+export declare const removeMouseListeners: (moveMouseEvent: (evt: MouseEvent) => void, mouseUpEvent: (evt: MouseEvent) => void) => void;
+/** Legger til touchmove og touchend event listeners,
+ *  basert på moveTouchEvent og touchUpEvent eventene */
+export declare const addTouchListeners: (moveTouchEvent: (evt: TouchEvent) => void, touchUpEvent: (evt: TouchEvent) => void) => void;
+/** Fjerner touchmove og touchup event listeners,
+ *  basert på moveTouchEvent og touchUpEvent eventene */
+export declare const removeTouchListeners: (moveTouchEvent: (evt: TouchEvent) => void, touchUpEvent: (evt: TouchEvent) => void) => void;
+//# sourceMappingURL=SliderUtils.d.ts.map

package/components/Slider/SliderUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderUtils.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/SliderUtils.tsx"],"names":[],"mappings":";AAAA,qFAAqF;AACrF,eAAO,MAAM,SAAS,uHAIrB,CAAC;AAEF,6DAA6D;AAC7D,eAAO,MAAM,gBAAgB,sHAM5B,CAAC;AAEF,4FAA4F;AAC5F,eAAO,MAAM,eAAe,uCAG3B,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,YAAY,uHAYxB,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,gGAU/C,CAAC;AAEF;;+DAE+D;AAC/D,eAAO,MAAM,mCAAmC,uHAY/C,CAAC;AAEF;;gEAEgE;AAChE,eAAO,MAAM,UAAU,sDAatB,CAAC;AAEF;;4BAE4B;AAC5B,eAAO,MAAM,yBAAyB,yFASrC,CAAC;AAEF;uCACuC;AACvC,eAAO,MAAM,wBAAwB,4GAUpC,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,8FAG7B,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,8FAGhC,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,iBAAiB,8FAG7B,CAAC;AAEF;wDACwD;AACxD,eAAO,MAAM,oBAAoB,8FAGhC,CAAC"}

package/components/Slider/componentdata.json

@@ -0,0 +1,137 @@
+{
+  "props": {
+    "title": {
+      "defaultValue": null,
+      "description": "Sets the title of the slider.",
+      "name": "title",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "labelLeft": {
+      "defaultValue": null,
+      "description": "Adds the left hand label to the element.",
+      "name": "labelLeft",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "labelRight": {
+      "defaultValue": null,
+      "description": "Adds the right hand label to the element.",
+      "name": "labelRight",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
+    "step": {
+      "defaultValue": null,
+      "description": "Decides the number of steps for each movement of the slider.",
+      "name": "step",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "number"
+      }
+    },
+    "disabled": {
+      "defaultValue": null,
+      "description": "Disables the slider element.",
+      "name": "disabled",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "boolean"
+      }
+    },
+    "onChange": {
+      "defaultValue": null,
+      "description": "Function to be called when the value state has changed.",
+      "name": "onChange",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "((value: number) => void)"
+      }
+    },
+    "testId": {
+      "defaultValue": null,
+      "description": "Sets the data-testid attribute.",
+      "name": "testId",
+      "parent": {
+        "fileName": "src/components/Slider/Slider.tsx",
+        "name": "SliderProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Slider/Slider.tsx",
+          "name": "SliderProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    }
+  }
+}

package/components/Slider/index.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,eAAe,MAAM,CAAC"}

package/components/Slider/index.js

@@ -0,0 +1,2 @@
+import{_ as e}from"../../_rollupPluginBabelHelpers-d0752906.js";import t,{useState as n,useRef as r,useEffect as a}from"react";import{c as o}from"../../index-9b84fabc.js";import{T as i}from"../../Title-fab4097d.js";import c from"./styles.module.scss";import{A as u}from"../../constants-ad6c82db.js";import"../Title/styles.module.scss";var s=function(e){return e.stopPropagation&&e.stopPropagation(),e.preventDefault&&e.preventDefault(),!1},l=function(e){return m(e)?e.touches[0].pageX:e.pageX},d=function(e){var t=e?e.getBoundingClientRect():void 0;return t?t.right-t.left:0},m=function(e){return("touchcancel"===e.type||"touchend"===e.type||"touchenter"===e.type||"touchleave"===e.type||"touchmove"===e.type||"touchstart"===e.type)&&!(0===e.touches.length)},f=function(e,t,n){var r=e-e%t,a=Math.floor(n/t)*t;e>a&&(e>a+(n-a)/2&&(r=n));return Math.round(r)},v=t.forwardRef((function(m,v){var p=m.title,h=m.labelLeft,_=m.labelRight,g=m.disabled,E=void 0!==g&&g,y=m.step,b=void 0===y?1:y,w=m.onChange,k=m.testId,L=n(50),x=e(L,2),N=x[0],A=x[1],D=n(!1),M=e(D,2),R=M[0],j=M[1],T=n(0),B=e(T,2),C=B[0],P=B[1],I=n(0),S=e(I,2),X=S[0],H=S[1],K=n(0),U=e(K,2),q=U[0],z=U[1],F=n(0),G=e(F,2),J=G[0],O=G[1],Q=v||r(null),V=r(null),W=function(e){ne(e)},Y=function(e){te(e)},Z=function(e){ne(e)},$=function(e){te(e)};a((function(){var e=d(Q.current),t=d(V.current);z(function(e,t,n,r,a){return(t-n)/(a-r)*e}(N,e,t,0,100)),P(e),H(t)}),[]),a((function(){R&&(function(e,t){document.addEventListener("mousemove",e,!1),document.addEventListener("mouseup",t,!1)}(W,Y),function(e,t){document.addEventListener("touchmove",e,!1),document.addEventListener("touchend",t,!1)}(Z,$))}),[R]),a((function(){!E&&w&&w(N)}),[N]);var ee=function(e){var t;if(!E){var n=d(Q.current),r=d(V.current),a=l(e);!function(e,t,n,r){var a=t?t.getBoundingClientRect():void 0,o=a?a.left:0;r(o?e-(o+n/2):0)}(a,V.current,r,re),j(!0),O(a),P(n),H(r),null===(t=V.current)||void 0===t||t.focus(),s(e)}},te=function(e){E||(j(!1),function(e,t){document.removeEventListener("mousemove",e,!1),document.removeEventListener("mouseup",t,!1)}(W,Y),function(e,t){document.removeEventListener("touchmove",e,!1),document.removeEventListener("touchend",t,!1)}(Z,$),s(e))},ne=function(e){if(!E&&R){var t=l(e);re(t-J),s(e)}},re=function(e){if(0!==e){var t=function(e,t,n,r){var a=r+e;return a<0&&(a=0),a>t-n&&(a=t-n),a}(e,C,X,q);z(t),O(t+e),A(function(e,t,n,r,a,o){var i=(t-n)/(o-a),c=Math.round(e/i);return f(c,r,o)}(t,C,X,b,0,100))}};return t.createElement("div",{className:c.slider,"data-testid":k,"data-analyticsid":u.Slider},p&&t.createElement(i,{htmlMarkup:"h3",margin:1.5,appearance:"title3"},p),t.createElement("div",{ref:Q,className:o(c["slider__track-wrapper"],E?c["slider__track-wrapper--disabled"]:""),onMouseDown:ee,onTouchStart:ee,"data-testid":"tracker"},t.createElement("div",{className:o(c.slider__track,E?c["slider__track--disabled"]:"")}),t.createElement("div",{ref:V,className:o(c.slider__trigger,E?c["slider__trigger--disabled"]:""),style:{left:"".concat(q,"px")},onKeyDown:function(e){if(!E){var t=(C-X)/100;"ArrowRight"!==e.key&&"ArrowDown"!==e.key||re(b*t),"ArrowLeft"!==e.key&&"ArrowUp"!==e.key||re(-b*t)}},role:"slider","aria-valuenow":N,"aria-valuemin":0,"aria-valuemax":100,"aria-label":"".concat(p?p+" ":"").concat(h?h+" ":"").concat(_?_+" ":""),tabIndex:E?-1:0},t.createElement("div",{className:o(c["slider__trigger-inner"],E?c["slider__trigger-inner--disabled"]:"")}))),(h||_)&&t.createElement("span",{className:c.slider__options},t.createElement("p",{className:c.slider__text,"aria-hidden":!0},h),t.createElement("p",{className:c.slider__text,"aria-hidden":!0},_)))}));export default v;export{v as Slider};
+//# sourceMappingURL=index.js.map

package/components/Slider/index.js.map

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

package/components/Slider/styles.module.scss

@@ -0,0 +1,85 @@
+@import '../../scss/spacers';
+@import '../../scss/breakpoints';
+@import '../../scss/palette';
+
+.slider {
+  width: 100%;
+  padding: getSpacer(m) 0;
+  position: relative;
+  outline: none !important;
+
+  &__track-wrapper {
+    width: 100%;
+    cursor: pointer;
+
+    &--disabled {
+      cursor: default;
+    }
+  }
+
+  &__track {
+    height: 2px;
+    background-color: $black;
+    width: 100%;
+    position: relative;
+    top: 1rem;
+
+    &--disabled {
+      background-color: $neutral600;
+    }
+  }
+
+  &__trigger {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 2rem;
+    height: 2rem;
+    background-color: $white;
+    border: 0.15rem solid $black;
+    border-radius: 1rem;
+    position: relative;
+    top: -0.05rem;
+    z-index: 9;
+    outline: none;
+    cursor: pointer;
+
+    &--disabled {
+      border-color: $neutral500;
+      cursor: default;
+    }
+  }
+
+  &__trigger-inner {
+    width: 1.25rem;
+    height: 1.25rem;
+    border: 0.1rem solid $black;
+    border-radius: 1rem;
+    background-color: $blueberry600;
+
+    :hover > &,
+    :focus > & {
+      background-color: $blueberry800;
+    }
+
+    &--disabled {
+      border-color: $neutral500;
+      background-color: $neutral200;
+
+      :hover > &,
+      :focus > & {
+        background-color: $neutral200;
+      }
+    }
+  }
+
+  &__options {
+    display: inline-flex;
+    justify-content: space-between;
+    width: 100%;
+  }
+
+  &__text {
+    margin: 0;
+  }
+}

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

@@ -0,0 +1,19 @@
+export type Styles = {
+  slider: string;
+  slider__options: string;
+  slider__text: string;
+  slider__track: string;
+  'slider__track--disabled': string;
+  'slider__track-wrapper': string;
+  'slider__track-wrapper--disabled': string;
+  slider__trigger: string;
+  'slider__trigger--disabled': string;
+  'slider__trigger-inner': string;
+  'slider__trigger-inner--disabled': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Spacer/Spacer.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { SpacerSizes } from './../../theme/spacers';
+interface SpacerProps {
+    /** Sets the size of the spacer. */
+    size?: SpacerSizes;
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare const Spacer: React.ForwardRefExoticComponent<SpacerProps & React.RefAttributes<HTMLElement>>;
+export default Spacer;
+//# sourceMappingURL=Spacer.d.ts.map

package/components/Spacer/Spacer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spacer.d.ts","sourceRoot":"","sources":["../../../src/components/Spacer/Spacer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAKpD,UAAU,WAAW;IACnB,mCAAmC;IACnC,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,MAAM,iFAqBV,CAAC;AAEH,eAAe,MAAM,CAAC"}