@norges-domstoler/dds-components 5.2.0-beta.2 → 5.2.0

package/dist/components/ScrollableContainer/Scrollbar.js

@@ -0,0 +1,178 @@
+import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from 'tslib';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRef, useState, useCallback, useEffect } from 'react';
+import styled from 'styled-components';
+import { scrollbarTokens } from './ScrollableContainer.tokens.js';
+import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+
+var track = scrollbarTokens.track,
+    thumb = scrollbarTokens.thumb,
+    minThumbHeightPx = scrollbarTokens.minThumbHeightPx;
+var ScrollbarOuterWrapper = styled.div.withConfig({
+  displayName: "Scrollbar__ScrollbarOuterWrapper",
+  componentId: "sc-mphi5n-0"
+})([""]);
+var ScrollbarElements = styled.div.withConfig({
+  displayName: "Scrollbar__ScrollbarElements",
+  componentId: "sc-mphi5n-1"
+})(["display:block;height:100%;position:relative;display:grid;justify-items:center;"]);
+var Track = styled.div.withConfig({
+  displayName: "Scrollbar__Track",
+  componentId: "sc-mphi5n-2"
+})(["bottom:0;top:0;position:absolute;background-color:", ";border-radius:", ";width:", ";"], track.backgroundColor, track.borderRadius, track.width);
+var Thumb = styled.div.withConfig({
+  displayName: "Scrollbar__Thumb",
+  componentId: "sc-mphi5n-3"
+})(["position:absolute;background-color:", ";border-radius:", ";width:", ";transition:background-color 0.2s;&:hover{background-color:", ";}"], thumb.base.backgroundColor, thumb.base.borderRadius, thumb.base.width, thumb.hover.backgroundColor);
+var Scrollbar = function Scrollbar(props) {
+  var id = props.id,
+      className = props.className,
+      htmlProps = props.htmlProps,
+      contentRef = props.contentRef,
+      rest = __rest(props, ["id", "className", "htmlProps", "contentRef"]);
+
+  var trackRef = useRef(null);
+  var thumbRef = useRef(null);
+
+  var _useState = useState(minThumbHeightPx),
+      _useState2 = _slicedToArray(_useState, 2),
+      thumbHeight = _useState2[0],
+      setThumbHeight = _useState2[1];
+
+  var _useState3 = useState(true),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isScrollable = _useState4[0],
+      setIsScrollable = _useState4[1];
+
+  var _useState5 = useState(0),
+      _useState6 = _slicedToArray(_useState5, 2),
+      thumbTop = _useState6[0],
+      setThumbTop = _useState6[1];
+
+  var observer = useRef(null);
+
+  var _useState7 = useState(0),
+      _useState8 = _slicedToArray(_useState7, 2),
+      scrollStartPosition = _useState8[0],
+      setScrollStartPosition = _useState8[1];
+
+  var _useState9 = useState(0),
+      _useState10 = _slicedToArray(_useState9, 2),
+      initialScrollTop = _useState10[0],
+      setInitialScrollTop = _useState10[1];
+
+  var _useState11 = useState(false),
+      _useState12 = _slicedToArray(_useState11, 2),
+      isDragging = _useState12[0],
+      setIsDragging = _useState12[1];
+
+  function handleResize(ref, trackSize) {
+    var clientHeight = ref.clientHeight,
+        scrollHeight = ref.scrollHeight;
+    setIsScrollable(clientHeight !== scrollHeight);
+    setThumbHeight(Math.max(clientHeight / scrollHeight * trackSize, minThumbHeightPx));
+  }
+
+  var handleTrackClick = useCallback(function (e) {
+    if (contentRef && contentRef.current) {
+      var trackCurrent = trackRef.current;
+      var contentCurrent = contentRef.current;
+
+      if (trackCurrent && contentCurrent) {
+        var clientY = e.clientY;
+        var target = e.target;
+        var rect = target.getBoundingClientRect();
+        var trackTop = rect.top;
+        var thumbOffset = -(thumbHeight / 2);
+        var clickRatio = (clientY - trackTop + thumbOffset) / trackCurrent.clientHeight;
+        var scrollAmount = Math.floor(clickRatio * contentCurrent.scrollHeight);
+        contentCurrent.scrollTo({
+          top: scrollAmount,
+          behavior: 'smooth'
+        });
+      }
+    }
+  }, [thumbHeight]);
+  var handleThumbPositioning = useCallback(function () {
+    console.log('positioning');
+
+    if (!(contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) || !trackRef.current || !thumbRef.current) {
+      return;
+    }
+
+    var _contentRef$current = contentRef.current,
+        contentTop = _contentRef$current.scrollTop,
+        contentHeight = _contentRef$current.scrollHeight;
+    var clientHeight = trackRef.current.clientHeight;
+    var newTop = +contentTop / +contentHeight * clientHeight;
+    newTop = Math.min(newTop, clientHeight - thumbHeight);
+    setThumbTop(newTop);
+  }, []);
+  useEffect(function () {
+    if (contentRef && contentRef.current && trackRef.current) {
+      var ref = contentRef.current;
+      var clientHeight = trackRef.current.clientHeight;
+      observer.current = new ResizeObserver(function () {
+        handleResize(ref, clientHeight);
+      });
+      observer.current.observe(ref);
+      ref.addEventListener('scroll', handleThumbPositioning);
+      return function () {
+        var _a;
+
+        (_a = observer.current) === null || _a === void 0 ? void 0 : _a.unobserve(ref);
+        ref.removeEventListener('scroll', handleThumbPositioning);
+      };
+    }
+  }, []);
+  var handleThumbMousedown = useCallback(function (e) {
+    setScrollStartPosition(e.clientY);
+    if (contentRef && contentRef.current) setInitialScrollTop(contentRef.current.scrollTop);
+    setIsDragging(true);
+  }, []);
+  var handleThumbMouseup = useCallback(function () {
+    if (isDragging) {
+      setIsDragging(false);
+    }
+  }, [isDragging]);
+  var handleThumbMousemove = useCallback(function (e) {
+    if (contentRef && contentRef.current) {
+      if (isDragging) {
+        var _contentRef$current2 = contentRef.current,
+            contentScrollHeight = _contentRef$current2.scrollHeight,
+            contentOffsetHeight = _contentRef$current2.offsetHeight;
+        var deltaY = (e.clientY - scrollStartPosition) * (contentOffsetHeight / thumbHeight);
+        var newScrollTop = Math.min(initialScrollTop + deltaY, contentScrollHeight - contentOffsetHeight);
+        contentRef.current.scrollTop = newScrollTop;
+      }
+    }
+  }, [isDragging, scrollStartPosition, thumbHeight]);
+  useEffect(function () {
+    document.addEventListener('mousemove', handleThumbMousemove);
+    document.addEventListener('mouseup', handleThumbMouseup);
+    document.addEventListener('mouseleave', handleThumbMouseup);
+    return function () {
+      document.removeEventListener('mousemove', handleThumbMousemove);
+      document.removeEventListener('mouseup', handleThumbMouseup);
+      document.removeEventListener('mouseleave', handleThumbMouseup);
+    };
+  }, [handleThumbMousemove, handleThumbMouseup]);
+  return isScrollable ? jsx(ScrollbarOuterWrapper, Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest), {
+    children: jsxs(ScrollbarElements, {
+      children: [jsx(Track, {
+        ref: trackRef,
+        onClick: handleTrackClick
+      }), jsx(Thumb, {
+        style: {
+          height: thumbHeight,
+          top: thumbTop
+        },
+        ref: thumbRef,
+        onMouseDown: handleThumbMousedown
+      })]
+    })
+  })) : null;
+};
+
+export { Scrollbar };

package/dist/components/ScrollableContainer/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Scrollbar';
+export * from './ScrollableContainer';
+export * from './scrollbarStyling';

package/dist/components/ScrollableContainer/scrollbarStyling.d.ts

@@ -0,0 +1,26 @@
+/**
+ * CSS-in-JS scrollbar styling til bruk der det ikke passer å bruke dedikerte komponenter. Inkluderer styling for webkit pseudo-elementer og for Firefox.
+ */
+export declare const scrollbarStyling: {
+    webkit: {
+        '&::-webkit-scrollbar': {
+            width: string;
+            height: string;
+        };
+        '&::-webkit-scrollbar-track': {
+            background: string;
+            borderRadius: string;
+        };
+        '&::-webkit-scrollbar-thumb': {
+            background: string;
+            borderRadius: string;
+        };
+    };
+    '&::-webkit-scrollbar-thumb:hover': {
+        background: string;
+    };
+    firefox: {
+        scrollbarColor: string;
+        scrollbarWidth: string;
+    };
+};

package/dist/components/ScrollableContainer/scrollbarStyling.js

@@ -0,0 +1,40 @@
+import { scrollbarTokens } from './ScrollableContainer.tokens.js';
+
+var thumb = scrollbarTokens.thumb,
+    track = scrollbarTokens.track;
+/**
+ * CSS-in-JS scrollbar styling til bruk der det ikke passer å bruke dedikerte komponenter. Inkluderer styling for webkit pseudo-elementer og for Firefox.
+ */
+
+var scrollbarStyling = {
+  webkit: {
+    /* width */
+    '&::-webkit-scrollbar': {
+      width: track.width,
+      height: track.width
+    },
+
+    /* Track */
+    '&::-webkit-scrollbar-track': {
+      background: track.backgroundColor,
+      borderRadius: track.borderRadius
+    },
+
+    /* Handle */
+    '&::-webkit-scrollbar-thumb': {
+      background: thumb.base.backgroundColor,
+      borderRadius: thumb.base.borderRadius
+    }
+  },
+
+  /* Handle on hover */
+  '&::-webkit-scrollbar-thumb:hover': {
+    background: thumb.hover.backgroundColor
+  },
+  firefox: {
+    scrollbarColor: thumb.base.backgroundColor + ' ' + track.backgroundColor,
+    scrollbarWidth: 'thin'
+  }
+};
+
+export { scrollbarStyling };

package/dist/components/Select/Select.styles.js

@@ -2,7 +2,7 @@ import styled, { css } from 'styled-components';
 import { typographyTokens } from '../Typography/Typography.tokens.js';
 import { selectTokens } from './Select.tokens.js';
 import { Typography } from '../Typography/Typography.js';
-import { scrollbarStyling } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 
 var prefix = 'dds-select';
 var Label = styled(Typography).withConfig({
@@ -12,14 +12,14 @@ var Label = styled(Typography).withConfig({
 var Container = styled.div.withConfig({
   displayName: "Selectstyles__Container",
   componentId: "sc-19jkd5s-1"
-})(["@media (prefers-reduced-motion:no-preference){transition:box-shadow 0.2s,border-color 0.2s,background-color 0.2s;}position:relative;", " ", " *::selection{", "}", " &:hover{", " ", "{", "}}&:focus-within{", " ", "{", "}}", " .", "__menu-list{", "}&:hover .", "__dropdown-indicator,&:focus-within .", "__dropdown-indicator{", "}", " ", ""], selectTokens.container.base, scrollbarStyling, typographyTokens.selection.base, function (_ref) {
+})(["@media (prefers-reduced-motion:no-preference){transition:box-shadow 0.2s,border-color 0.2s,background-color 0.2s;}position:relative;", " *::selection{", "}", " &:hover{", " ", "{", "}}&:focus-within{", " ", "{", "}}", " .", "__menu-list{", " ", "}&:hover .", "__dropdown-indicator,&:focus-within .", "__dropdown-indicator{", "}", " ", ""], selectTokens.container.base, typographyTokens.selection.base, function (_ref) {
   var hasLabel = _ref.hasLabel,
       isMulti = _ref.isMulti;
   return isMulti && hasLabel ? css([".", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.valueContainer.isMulti.withLabel.base, prefix, selectTokens.indicatorsContainer.isMulti.withLabel.base) : isMulti && !hasLabel ? css([".", "__control{", "}.", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.input.isMulti.noLabel.base, prefix, selectTokens.valueContainer.isMulti.noLabel.base, prefix, selectTokens.indicatorsContainer.isMulti.noLabel.base) : hasLabel ? css([".", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.valueContainer.withLabel.base, prefix, selectTokens.indicatorsContainer.withLabel.base) : css([".", "__control{", "}.", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.input.noLabel.base, prefix, selectTokens.valueContainer.noLabel.base, prefix, selectTokens.indicatorsContainer.noLabel.base);
 }, selectTokens.container.hover.base, Label, selectTokens.label.hover.base, selectTokens.container.focus.base, Label, selectTokens.label.focus.base, function (_ref2) {
   var errorMessage = _ref2.errorMessage;
   return errorMessage && css(["", " &:hover{", "}&:focus-within{", "}"], selectTokens.container.danger.base, selectTokens.container.danger.hover.base, selectTokens.container.danger.focus.base);
-}, prefix, scrollbarStyling, prefix, prefix, selectTokens.dropdownIndicator.hover.base, function (_ref3) {
+}, prefix, scrollbarStyling.webkit, scrollbarStyling.firefox, prefix, prefix, selectTokens.dropdownIndicator.hover.base, function (_ref3) {
   var isDisabled = _ref3.isDisabled;
   return isDisabled && css(["cursor:not-allowed;", " &:hover{box-shadow:none;", " ", "{", "}&:hover .", "__dropdown-indicator{", "}}"], selectTokens.container.disabled.base, selectTokens.container.disabled.base, Label, selectTokens.label.base, prefix, selectTokens.dropdownIndicator.base);
 }, function (_ref4) {

package/dist/components/Table/Table.js

@@ -4,12 +4,12 @@ import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
 import { cellTokens } from './Cell.tokens.js';
 import { typographyTokens } from '../Typography/Typography.tokens.js';
-import { scrollbarStyling } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 
 var StyledTable = styled.table.withConfig({
   displayName: "Table__StyledTable",
   componentId: "sc-bw0w0a-0"
-})(["border-spacing:0;border-collapse:collapse;*::selection{", "}", " ", " ", ""], typographyTokens.selection.base, scrollbarStyling, function (_ref) {
+})(["border-spacing:0;border-collapse:collapse;*::selection{", "}", " ", " ", " ", ""], typographyTokens.selection.base, scrollbarStyling.webkit, scrollbarStyling.firefox, function (_ref) {
   var density = _ref.density;
   return density && css(["td,th{", "}"], cellTokens.density[density].base);
 }, function (_ref2) {

package/dist/components/Table/TableWrapper.js

@@ -3,15 +3,15 @@ import { __rest } from 'tslib';
 import { jsx } from 'react/jsx-runtime';
 import { useState, useRef, useEffect } from 'react';
 import styled, { css } from 'styled-components';
-import { scrollbarStyling } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 
 var Wrapper = styled.div.withConfig({
   displayName: "TableWrapper__Wrapper",
   componentId: "sc-eb384b-0"
-})(["", " ", ""], function (_ref) {
+})(["", " ", " ", ""], function (_ref) {
   var overflowX = _ref.overflowX;
   return overflowX && css(["overflow-x:auto;"]);
-}, scrollbarStyling);
+}, scrollbarStyling.webkit, scrollbarStyling.firefox);
 var TableWrapper = function TableWrapper(_a) {
   var children = _a.children,
       rest = __rest(_a, ["children"]);

package/dist/components/Tabs/TabList.js

@@ -5,7 +5,7 @@ import { forwardRef, useState, Children, isValidElement, cloneElement } from 're
 import styled from 'styled-components';
 import { tabsTokens } from './Tabs.tokens.js';
 import { useTabsContext } from './Tabs.context.js';
-import { scrollbarStyling } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 import { useRoveFocus } from '../../hooks/useRoveFocus.js';
 import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
 import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
@@ -14,7 +14,7 @@ import { useOnClickOutside } from '../../hooks/useOnClickOutside.js';
 var TabRow = styled.div.withConfig({
   displayName: "TabList__TabRow",
   componentId: "sc-1ldr0lz-0"
-})(["", " ", " scroll-snap-type:x mandatory;@media (prefers-reduced-motion:no-preference){scroll-behavior:smooth;}&:focus-visible{", "}&:focus-visible button{outline:none;}"], tabsTokens.tabList.base, scrollbarStyling, tabsTokens.tabList.focus.base);
+})(["", " ", " ", " scroll-snap-type:x mandatory;@media (prefers-reduced-motion:no-preference){scroll-behavior:smooth;}&:focus-visible{", "}&:focus-visible button{outline:none;}"], tabsTokens.tabList.base, scrollbarStyling.webkit, scrollbarStyling.firefox, tabsTokens.tabList.focus.base);
 var TabList = /*#__PURE__*/forwardRef(function (_a, ref) {
   var children = _a.children,
       id = _a.id,

package/dist/components/TextInput/TextInput.styles.js

@@ -1,13 +1,13 @@
 import styled, { css } from 'styled-components';
 import { textInputTokens } from './TextInput.tokens.js';
 import { StatefulInput, Label as Label$1 } from '../../helpers/Input/Input.styles.js';
-import { scrollbarStyling } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 import { inputTokens } from '../../helpers/Input/Input.tokens.js';
 
 var TextArea = styled(StatefulInput).withConfig({
   displayName: "TextInputstyles__TextArea",
   componentId: "sc-165zflr-0"
-})(["", " ", " ", " &:hover:enabled:read-write ~ label{background-color:", ";}"], scrollbarStyling, textInputTokens.multiline.base, function (_ref) {
+})(["", " ", " ", " ", " &:hover:enabled:read-write ~ label{background-color:", ";}"], scrollbarStyling.webkit, scrollbarStyling.firefox, textInputTokens.multiline.base, function (_ref) {
   var hasLabel = _ref.hasLabel;
   return css(["", ""], textInputTokens.multiline[hasLabel].base);
 }, function (_ref2) {

package/dist/components/TextInput/TextInput.tokens.js

@@ -1,5 +1,5 @@
 import { ddsBaseTokens, ddsReferenceTokens } from '@norges-domstoler/dds-design-tokens';
-import { scrollbarWidthNumberPx } from '../../helpers/styling/scrollbarStyling.js';
+import { scrollbarWidthNumberPx } from '../ScrollableContainer/ScrollableContainer.tokens.js';
 
 var Colors = ddsBaseTokens.colors,
     Spacing = ddsBaseTokens.spacing;

package/dist/helpers/styling/focusVisible.js

@@ -1,8 +1,9 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 
 var Border = ddsBaseTokens.border,
-    Colors = ddsBaseTokens.colors;
-var outlineOffset = '2px';
+    Colors = ddsBaseTokens.colors,
+    spacing = ddsBaseTokens.spacing;
+var outlineOffset = spacing.SizesDdsSpacingLocalX0125;
 var focusVisible = {
   outline: "".concat(Border.BordersDdsBorderFocusBaseStrokeWeight, " ").concat(Border.BordersDdsBorderFocusBaseStroke, " solid"),
   outlineOffset: outlineOffset

package/dist/helpers/styling/index.d.ts

@@ -5,4 +5,3 @@ export * from './hover';
 export * from './focus';
 export * from './danger';
 export * from './hideInput';
-export * from './scrollbarStyling';

package/dist/index.d.ts

@@ -33,5 +33,6 @@ export * from './components/Tabs';
 export * from './components/Tag';
 export * from './components/Chip';
 export * from './components/VisuallyHidden';
+export * from './components/ScrollableContainer';
 export * from './icons/tsx';
 export * from './components/Stepper';

package/dist/index.js

@@ -59,6 +59,9 @@ export { Tag } from './components/Tag/Tag.js';
 export { Chip } from './components/Chip/Chip.js';
 export { ChipGroup } from './components/Chip/ChipGroup.js';
 export { VisuallyHidden } from './components/VisuallyHidden/VisuallyHidden.js';
+export { Scrollbar } from './components/ScrollableContainer/Scrollbar.js';
+export { ScrollableContainer } from './components/ScrollableContainer/ScrollableContainer.js';
+export { scrollbarStyling } from './components/ScrollableContainer/scrollbarStyling.js';
 export { AppsIcon } from './icons/tsx/apps.js';
 export { ArchiveIcon } from './icons/tsx/archive.js';
 export { ArrowDownIcon } from './icons/tsx/arrowDown.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@norges-domstoler/dds-components",
-  "version": "5.2.0-beta.2",
+  "version": "5.2.0",
   "description": "React components used in Elsa - domstolenes designsystem",
   "author": "Elsa team",
   "license": "MIT",
@@ -116,8 +116,6 @@
     }
   },
   "dependencies": {
-    "@emotion/react": "^11.10.0",
-    "@emotion/styled": "^11.10.0",
     "@floating-ui/react-dom": "^1.0.0",
     "focus-visible": "^5.2.0",
     "react-select": "^5.4.0",

package/dist/cjs/components/DescriptionList/DescriptionListDesc.tokens.d.ts

@@ -1,7 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListDescTokens: {
-    base: CSSObject;
-    icon: {
-        base: CSSObject;
-    };
-};

package/dist/cjs/components/DescriptionList/DescriptionListGroup.tokens.d.ts

@@ -1,4 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListGroupTokens: {
-    base: CSSObject;
-};

package/dist/cjs/components/DescriptionList/DescriptionListTerm.tokens.d.ts

@@ -1,13 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListTermTokens: {
-    appearance: {
-        small: {
-            base: CSSObject;
-        };
-        bold: {
-            base: CSSObject;
-        };
-    };
-    unwrappedTopAndBottomSpace: string;
-    unwrappedBetweenSpace: string;
-};

package/dist/cjs/helpers/styling/scrollbarStyling.d.ts

@@ -1,3 +0,0 @@
-export declare const scrollbarWidthNumberPx = 10;
-export declare const scrollbarWidth: string;
-export declare const scrollbarStyling: import("styled-components").FlattenSimpleInterpolation;

package/dist/components/DescriptionList/DescriptionListDesc.tokens.d.ts

@@ -1,7 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListDescTokens: {
-    base: CSSObject;
-    icon: {
-        base: CSSObject;
-    };
-};

package/dist/components/DescriptionList/DescriptionListDesc.tokens.js

@@ -1,22 +0,0 @@
-import { ddsBaseTokens, ddsReferenceTokens } from '@norges-domstoler/dds-design-tokens';
-
-var spacing = ddsBaseTokens.spacing,
-    fontPackages = ddsBaseTokens.fontPackages;
-var textDefault = ddsReferenceTokens.textDefault;
-var base = Object.assign(Object.assign({}, fontPackages.body_sans_03.base), {
-  display: 'flex',
-  alignItems: 'center',
-  gap: spacing.SizesDdsSpacingLocalX025,
-  color: textDefault.textColor
-});
-var iconBase = {
-  marginRight: spacing.SizesDdsSpacingLocalX025
-};
-var descriptionListDescTokens = {
-  base: base,
-  icon: {
-    base: iconBase
-  }
-};
-
-export { descriptionListDescTokens };

package/dist/components/DescriptionList/DescriptionListGroup.tokens.d.ts

@@ -1,4 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListGroupTokens: {
-    base: CSSObject;
-};

package/dist/components/DescriptionList/DescriptionListGroup.tokens.js

@@ -1,11 +0,0 @@
-import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
-
-var Spacing = ddsBaseTokens.spacing;
-var base = {
-  margin: Spacing.SizesDdsSpacingLocalX2
-};
-var descriptionListGroupTokens = {
-  base: base
-};
-
-export { descriptionListGroupTokens };

package/dist/components/DescriptionList/DescriptionListTerm.tokens.d.ts

@@ -1,13 +0,0 @@
-import { CSSObject } from 'styled-components';
-export declare const descriptionListTermTokens: {
-    appearance: {
-        small: {
-            base: CSSObject;
-        };
-        bold: {
-            base: CSSObject;
-        };
-    };
-    unwrappedTopAndBottomSpace: string;
-    unwrappedBetweenSpace: string;
-};

package/dist/components/DescriptionList/DescriptionListTerm.tokens.js

@@ -1,27 +0,0 @@
-import { ddsBaseTokens, ddsReferenceTokens } from '@norges-domstoler/dds-design-tokens';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
-
-var Spacing = ddsBaseTokens.spacing,
-    FontPackages = ddsBaseTokens.fontPackages,
-    Colors = ddsBaseTokens.colors;
-var textDefault = ddsReferenceTokens.textDefault;
-var boldBase = Object.assign(Object.assign(Object.assign({}, FontPackages.body_sans_03.base), typographyTokens.style.bold.base), {
-  color: textDefault.textColor
-});
-var smallBase = Object.assign(Object.assign({}, FontPackages.body_sans_01.base), {
-  color: Colors.DdsColorNeutralsGray7
-});
-var descriptionListTermTokens = {
-  appearance: {
-    small: {
-      base: smallBase
-    },
-    bold: {
-      base: boldBase
-    }
-  },
-  unwrappedTopAndBottomSpace: Spacing.SizesDdsSpacingLocalX1,
-  unwrappedBetweenSpace: Spacing.SizesDdsSpacingLocalX2
-};
-
-export { descriptionListTermTokens };

package/dist/helpers/styling/scrollbarStyling.d.ts

@@ -1,3 +0,0 @@
-export declare const scrollbarWidthNumberPx = 10;
-export declare const scrollbarWidth: string;
-export declare const scrollbarStyling: import("styled-components").FlattenSimpleInterpolation;

package/dist/helpers/styling/scrollbarStyling.js

@@ -1,8 +0,0 @@
-import { css } from 'styled-components';
-import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
-
-var scrollbarWidthNumberPx = 10;
-var scrollbarWidth = "".concat(scrollbarWidthNumberPx, "px");
-var scrollbarStyling = css(["&::-webkit-scrollbar{width:", ";height:", ";}&::-webkit-scrollbar-track{background:transparent;border-radius:100px;}&::-webkit-scrollbar-thumb{background:", ";border-radius:100px;}&::-webkit-scrollbar-thumb:hover{background:", ";}scrollbar-color:", " transparent;scrollbar-width:thin;"], scrollbarWidth, scrollbarWidth, ddsBaseTokens.colors.DdsColorPrimaryDarkest.slice(0, -2) + '0.35)', ddsBaseTokens.colors.DdsColorPrimaryDarkest.slice(0, -2) + '0.5)', ddsBaseTokens.colors.DdsColorPrimaryDarkest.slice(0, -2) + '0.35)');
-
-export { scrollbarStyling, scrollbarWidth, scrollbarWidthNumberPx };