@norges-domstoler/dds-components 9.3.0 → 9.4.0

package/dist/components/Table/TableWrapper.js

@@ -16,36 +16,30 @@ var Wrapper = styled.div.withConfig({
 }, scrollbarStyling.webkit, scrollbarStyling.firefox);
 var TableWrapper = function TableWrapper(_a) {
   var children = _a.children,
-      rest = __rest(_a, ["children"]);
-
+    rest = __rest(_a, ["children"]);
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      overflowX = _useState2[0],
-      setOverflowX = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    overflowX = _useState2[0],
+    setOverflowX = _useState2[1];
   var _useState3 = useState(window.innerWidth),
-      _useState4 = _slicedToArray(_useState3, 2),
-      windowWidth = _useState4[0],
-      setWindowWidth = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    windowWidth = _useState4[0],
+    setWindowWidth = _useState4[1];
   function isOverflowingX(event) {
     return event.offsetWidth < event.scrollWidth;
   }
-
   var wrapperRef = useRef(null);
   useEffect(function () {
     if (wrapperRef && wrapperRef.current && isOverflowingX(wrapperRef.current)) {
       setOverflowX(true);
       return;
     }
-
     setOverflowX(false);
   }, [windowWidth]);
   useEffect(function () {
     function handleResize() {
       setWindowWidth(window.innerWidth);
     }
-
     window.addEventListener('resize', handleResize);
     return function () {
       return window.removeEventListener('resize', handleResize);

package/dist/components/Tabs/Tab.js

@@ -32,30 +32,26 @@ var Button = styled.button.withConfig({
 }, focusVisible, tab.hover.borderColor, tab.hover.color, tab.hover.boxShadow);
 var Tab = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$active = props.active,
-      active = _props$active === void 0 ? false : _props$active,
-      icon = props.icon,
-      children = props.children,
-      focus = props.focus,
-      setFocus = props.setFocus,
-      index = props.index,
-      onClick = props.onClick,
-      onKeyDown = props.onKeyDown,
-      id = props.id,
-      className = props.className,
-      htmlProps = props.htmlProps,
-      rest = __rest(props, ["active", "icon", "children", "focus", "setFocus", "index", "onClick", "onKeyDown", "id", "className", "htmlProps"]);
-
+    active = _props$active === void 0 ? false : _props$active,
+    icon = props.icon,
+    children = props.children,
+    focus = props.focus,
+    setFocus = props.setFocus,
+    index = props.index,
+    onClick = props.onClick,
+    onKeyDown = props.onKeyDown,
+    id = props.id,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = __rest(props, ["active", "icon", "children", "focus", "setFocus", "index", "onClick", "onKeyDown", "id", "className", "htmlProps"]);
   var itemRef = useRef(null);
   var combinedRef = useCombinedRef(ref, itemRef);
-
   var _useTabsContext = useTabsContext(),
-      tabPanelsRef = _useTabsContext.tabPanelsRef,
-      setHasTabFocus = _useTabsContext.setHasTabFocus,
-      tabContentDirection = _useTabsContext.tabContentDirection;
-
+    tabPanelsRef = _useTabsContext.tabPanelsRef,
+    setHasTabFocus = _useTabsContext.setHasTabFocus,
+    tabContentDirection = _useTabsContext.tabContentDirection;
   useEffect(function () {
     var _a;
-
     if (focus) {
       (_a = itemRef.current) === null || _a === void 0 ? void 0 : _a.focus();
       setHasTabFocus(true);
@@ -63,7 +59,6 @@ var Tab = /*#__PURE__*/forwardRef(function (props, ref) {
   }, [focus]);
   useOnKeyDown('Tab', function () {
     var _a;
-
     setHasTabFocus(false);
     (_a = tabPanelsRef === null || tabPanelsRef === void 0 ? void 0 : tabPanelsRef.current) === null || _a === void 0 ? void 0 : _a.focus();
   });
@@ -72,17 +67,14 @@ var Tab = /*#__PURE__*/forwardRef(function (props, ref) {
       setFocus(index);
     }
   }, [index, setFocus]);
-
   var handleOnClick = function handleOnClick(e) {
     handleSelect();
     onClick && onClick(e);
   };
-
   var handleOnKeyDown = function handleOnKeyDown(e) {
     handleSelect();
     onKeyDown && onKeyDown(e);
   };
-
   var buttonProps = Object.assign(Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest)), {
     ref: combinedRef,
     'aria-selected': active,

package/dist/components/Tabs/TabList.js

@@ -28,27 +28,23 @@ var TabRow = styled.div.withConfig({
 })(["border-bottom:", ";display:grid;grid-auto-flow:column;grid-auto-columns:1fr;overflow-x:auto;", " ", " scroll-snap-type:x mandatory;@media (prefers-reduced-motion:no-preference){scroll-behavior:smooth;transition:", ";}&:focus-visible{", "}&:focus-visible button{outline:none;}"], tabList.borderBottom, scrollbarStyling.webkit, scrollbarStyling.firefox, focusVisibleTransitionValue, focusVisible);
 var TabList = /*#__PURE__*/forwardRef(function (_a, ref) {
   var children = _a.children,
-      id = _a.id,
-      onFocus = _a.onFocus,
-      rest = __rest(_a, ["children", "id", "onFocus"]);
-
+    id = _a.id,
+    onFocus = _a.onFocus,
+    rest = __rest(_a, ["children", "id", "onFocus"]);
   var _useTabsContext = useTabsContext(),
-      activeTab = _useTabsContext.activeTab,
-      tabsId = _useTabsContext.tabsId,
-      handleTabChange = _useTabsContext.handleTabChange,
-      tabListRef = _useTabsContext.tabListRef,
-      hasTabFocus = _useTabsContext.hasTabFocus,
-      tabPanelsRef = _useTabsContext.tabPanelsRef,
-      setHasTabFocus = _useTabsContext.setHasTabFocus;
-
+    activeTab = _useTabsContext.activeTab,
+    tabsId = _useTabsContext.tabsId,
+    handleTabChange = _useTabsContext.handleTabChange,
+    tabListRef = _useTabsContext.tabListRef,
+    hasTabFocus = _useTabsContext.hasTabFocus,
+    tabPanelsRef = _useTabsContext.tabPanelsRef,
+    setHasTabFocus = _useTabsContext.setHasTabFocus;
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(tabsId, "-tablist");
   var childrenArray = Children.toArray(children).length;
-
   var _useRoveFocus = useRoveFocus(childrenArray, !hasTabFocus, 'row'),
-      _useRoveFocus2 = _slicedToArray(_useRoveFocus, 2),
-      focus = _useRoveFocus2[0],
-      setFocus = _useRoveFocus2[1];
-
+    _useRoveFocus2 = _slicedToArray(_useRoveFocus, 2),
+    focus = _useRoveFocus2[0],
+    setFocus = _useRoveFocus2[1];
   var combinedRef = useCombinedRef(ref, tabListRef);
   var tabListChildren = Children.map(children, function (child, index) {
     return /*#__PURE__*/isValidElement(child) && /*#__PURE__*/cloneElement(child, {
@@ -65,19 +61,16 @@ var TabList = /*#__PURE__*/forwardRef(function (_a, ref) {
   });
   useOnKeyDown('Tab', function () {
     var _a;
-
     setHasTabFocus(false);
     (_a = tabPanelsRef === null || tabPanelsRef === void 0 ? void 0 : tabPanelsRef.current) === null || _a === void 0 ? void 0 : _a.focus();
   });
   useOnClickOutside((tabListRef === null || tabListRef === void 0 ? void 0 : tabListRef.current) || null, function () {
     setHasTabFocus(false);
   });
-
   var handleOnFocus = function handleOnFocus(event) {
     setHasTabFocus(true);
     onFocus && onFocus(event);
   };
-
   var tabListProps = Object.assign(Object.assign({}, rest), {
     ref: combinedRef,
     role: 'tablist',

package/dist/components/Tabs/TabPanel.js

@@ -20,13 +20,12 @@ var Panel = styled.div.withConfig({
 }, focusVisible);
 var TabPanel = /*#__PURE__*/forwardRef(function (_a, ref) {
   var _a$active = _a.active,
-      active = _a$active === void 0 ? false : _a$active,
-      children = _a.children,
-      id = _a.id,
-      className = _a.className,
-      htmlProps = _a.htmlProps,
-      rest = __rest(_a, ["active", "children", "id", "className", "htmlProps"]);
-
+    active = _a$active === void 0 ? false : _a$active,
+    children = _a.children,
+    id = _a.id,
+    className = _a.className,
+    htmlProps = _a.htmlProps,
+    rest = __rest(_a, ["active", "children", "id", "className", "htmlProps"]);
   var panelProps = Object.assign(Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest)), {
     ref: ref,
     tabIndex: 0,

package/dist/components/Tabs/TabPanels.js

@@ -9,13 +9,11 @@ import { useTabsContext } from './Tabs.context.js';
 
 var TabPanels = /*#__PURE__*/forwardRef(function (_a, ref) {
   var children = _a.children,
-      rest = __rest(_a, ["children"]);
-
+    rest = __rest(_a, ["children"]);
   var _useTabsContext = useTabsContext(),
-      activeTab = _useTabsContext.activeTab,
-      tabsId = _useTabsContext.tabsId,
-      tabPanelsRef = _useTabsContext.tabPanelsRef;
-
+    activeTab = _useTabsContext.activeTab,
+    tabsId = _useTabsContext.tabsId,
+    tabPanelsRef = _useTabsContext.tabPanelsRef;
   var combinedRef = useCombinedRef(ref, tabPanelsRef);
   var panelChildren = Children.map(children, function (child, index) {
     var active = index === activeTab;

package/dist/components/Tabs/Tabs.js

@@ -15,37 +15,31 @@ var Container = styled.div.withConfig({
 });
 var Tabs = /*#__PURE__*/forwardRef(function (props, ref) {
   var id = props.id,
-      activeTab = props.activeTab,
-      onChange = props.onChange,
-      _props$tabContentDire = props.tabContentDirection,
-      tabContentDirection = _props$tabContentDire === void 0 ? 'row' : _props$tabContentDire,
-      width = props.width,
-      children = props.children,
-      className = props.className,
-      htmlProps = props.htmlProps,
-      rest = __rest(props, ["id", "activeTab", "onChange", "tabContentDirection", "width", "children", "className", "htmlProps"]);
-
+    activeTab = props.activeTab,
+    onChange = props.onChange,
+    _props$tabContentDire = props.tabContentDirection,
+    tabContentDirection = _props$tabContentDire === void 0 ? 'row' : _props$tabContentDire,
+    width = props.width,
+    children = props.children,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = __rest(props, ["id", "activeTab", "onChange", "tabContentDirection", "width", "children", "className", "htmlProps"]);
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-tabs");
-
   var _useState = useState(activeTab || 0),
-      _useState2 = _slicedToArray(_useState, 2),
-      thisActiveTab = _useState2[0],
-      setActiveTab = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    thisActiveTab = _useState2[0],
+    setActiveTab = _useState2[1];
   var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      hasTabFocus = _useState4[0],
-      setHasTabFocus = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    hasTabFocus = _useState4[0],
+    setHasTabFocus = _useState4[1];
   var tabListRef = useRef(null);
   var tabPanelsRef = useRef(null);
-
   var handleTabChange = function handleTabChange(index) {
     setActiveTab(index);
     onChange && onChange(index);
   };
-
   useEffect(function () {
     if (activeTab !== undefined && activeTab !== thisActiveTab) {
       setActiveTab(activeTab);

package/dist/components/Tabs/Tabs.tokens.js

@@ -1,8 +1,8 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 
 var border = ddsBaseTokens.border,
-    spacing = ddsBaseTokens.spacing,
-    colors = ddsBaseTokens.colors;
+  spacing = ddsBaseTokens.spacing,
+  colors = ddsBaseTokens.colors;
 var tabList = {
   borderBottom: "".concat(border.BordersDdsBorderStyleLightStrokeWeight, " solid ").concat(border.BordersDdsBorderStyleLightStroke)
 };

package/dist/components/Tag/Tag.js

@@ -17,13 +17,12 @@ var Wrapper = styled(TextOverflowEllipsisWrapper).withConfig({
 });
 var Tag = /*#__PURE__*/forwardRef(function (props, ref) {
   var text = props.text,
-      _props$purpose = props.purpose,
-      purpose = _props$purpose === void 0 ? 'default' : _props$purpose,
-      id = props.id,
-      className = props.className,
-      htmlProps = props.htmlProps,
-      rest = __rest(props, ["text", "purpose", "id", "className", "htmlProps"]);
-
+    _props$purpose = props.purpose,
+    purpose = _props$purpose === void 0 ? 'default' : _props$purpose,
+    id = props.id,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = __rest(props, ["text", "purpose", "id", "className", "htmlProps"]);
   return jsx(Wrapper, Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest), {
     ref: ref,
     purpose: purpose

package/dist/components/Tag/Tag.tokens.js

@@ -2,8 +2,8 @@ import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 import { localMessageTokens } from '../LocalMessage/LocalMessage.tokens.js';
 
 var colors = ddsBaseTokens.colors,
-    borderRadius = ddsBaseTokens.borderRadius,
-    spacing = ddsBaseTokens.spacing;
+  borderRadius = ddsBaseTokens.borderRadius,
+  spacing = ddsBaseTokens.spacing;
 var typographyType = 'bodySans01';
 var wrapper = {
   border: '1px solid',

package/dist/components/TextArea/TextArea.js

@@ -28,46 +28,40 @@ var StyledTextArea = styled(StatefulInput).withConfig({
 })(["", " ", " height:auto;resize:vertical;vertical-align:bottom;padding-bottom:", ";", ""], scrollbarStyling.webkit, scrollbarStyling.firefox, textarea.paddingBottom, getFontStyling(inputTypographyTypes.medium));
 var TextArea = /*#__PURE__*/forwardRef(function (props, ref) {
   var id = props.id,
-      value = props.value,
-      defaultValue = props.defaultValue,
-      onChange = props.onChange,
-      errorMessage = props.errorMessage,
-      required = props.required,
-      disabled = props.disabled,
-      tip = props.tip,
-      label = props.label,
-      ariaRequired = props['aria-required'],
-      ariaDescribedby = props['aria-describedby'],
-      className = props.className,
-      style = props.style,
-      _props$width = props.width,
-      width = _props$width === void 0 ? defaultWidth : _props$width,
-      rest = __rest(props, ["id", "value", "defaultValue", "onChange", "errorMessage", "required", "disabled", "tip", "label", 'aria-required', 'aria-describedby', "className", "style", "width"]);
-
+    value = props.value,
+    defaultValue = props.defaultValue,
+    onChange = props.onChange,
+    errorMessage = props.errorMessage,
+    required = props.required,
+    disabled = props.disabled,
+    tip = props.tip,
+    label = props.label,
+    ariaRequired = props['aria-required'],
+    ariaDescribedby = props['aria-describedby'],
+    className = props.className,
+    style = props.style,
+    _props$width = props.width,
+    width = _props$width === void 0 ? defaultWidth : _props$width,
+    rest = __rest(props, ["id", "value", "defaultValue", "onChange", "errorMessage", "required", "disabled", "tip", "label", 'aria-required', 'aria-describedby', "className", "style", "width"]);
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-textArea");
   var textAreaRef = useRef(null);
   var multiRef = useCombinedRef(ref, textAreaRef);
-
   var _useState = useState(getDefaultText(value, defaultValue)),
-      _useState2 = _slicedToArray(_useState, 2),
-      text = _useState2[0],
-      setText = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    text = _useState2[0],
+    setText = _useState2[1];
   useEffect(function () {
     if (textAreaRef && textAreaRef.current) {
       textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight + 2, "px");
     }
   }, [text]);
-
   var onChangeHandler = function onChangeHandler(event) {
     setText(event.target.value);
-
     if (onChange) {
       onChange(event);
     }
   };
-
   var hasErrorMessage = !!errorMessage;
   var hasLabel = !!label;
   var tipId = derivativeIdGenerator(uniqueId, 'tip');

package/dist/components/TextInput/CharCounter.js

@@ -18,15 +18,13 @@ var Wrapper = styled(Typography).withConfig({
   displayName: "CharCounter__Wrapper",
   componentId: "sc-qty1z2-0"
 })(["margin-left:auto;"]);
-
 function CharCounter(props) {
   var current = props.current,
-      max = props.max,
-      id = props.id,
-      className = props.className,
-      htmlProps = props.htmlProps,
-      rest = __rest(props, ["current", "max", "id", "className", "htmlProps"]);
-
+    max = props.max,
+    id = props.id,
+    className = props.className,
+    htmlProps = props.htmlProps,
+    rest = __rest(props, ["current", "max", "id", "className", "htmlProps"]);
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-characterCounter");
   return jsxs(Wrapper, Object.assign({}, getBaseHTMLProps(uniqueId, className, htmlProps, rest), {

package/dist/components/TextInput/TextInput.js

@@ -20,56 +20,48 @@ import '../../utils/color.js';
 
 var defaultWidth = '320px';
 var defaultTinyWidth = '210px';
-
 var getWidth = function getWidth(size, width) {
   if (width) return width;
-
   if (size === 'tiny') {
     return defaultTinyWidth;
   }
-
   return defaultWidth;
 };
-
 var TextInput = /*#__PURE__*/forwardRef(function (_a, ref) {
   var label = _a.label,
-      disabled = _a.disabled,
-      readOnly = _a.readOnly,
-      errorMessage = _a.errorMessage,
-      tip = _a.tip,
-      required = _a.required,
-      maxLength = _a.maxLength,
-      onChange = _a.onChange,
-      id = _a.id,
-      width = _a.width,
-      _a$componentSize = _a.componentSize,
-      componentSize = _a$componentSize === void 0 ? 'medium' : _a$componentSize,
-      _a$type = _a.type,
-      type = _a$type === void 0 ? 'text' : _a$type,
-      _a$withCharacterCount = _a.withCharacterCounter,
-      withCharacterCounter = _a$withCharacterCount === void 0 ? true : _a$withCharacterCount,
-      className = _a.className,
-      style = _a.style,
-      value = _a.value,
-      defaultValue = _a.defaultValue,
-      ariaRequired = _a['aria-required'],
-      ariaDescribedby = _a['aria-describedby'],
-      icon = _a.icon,
-      rest = __rest(_a, ["label", "disabled", "readOnly", "errorMessage", "tip", "required", "maxLength", "onChange", "id", "width", "componentSize", "type", "withCharacterCounter", "className", "style", "value", "defaultValue", 'aria-required', 'aria-describedby', "icon"]);
-
+    disabled = _a.disabled,
+    readOnly = _a.readOnly,
+    errorMessage = _a.errorMessage,
+    tip = _a.tip,
+    required = _a.required,
+    maxLength = _a.maxLength,
+    onChange = _a.onChange,
+    id = _a.id,
+    width = _a.width,
+    _a$componentSize = _a.componentSize,
+    componentSize = _a$componentSize === void 0 ? 'medium' : _a$componentSize,
+    _a$type = _a.type,
+    type = _a$type === void 0 ? 'text' : _a$type,
+    _a$withCharacterCount = _a.withCharacterCounter,
+    withCharacterCounter = _a$withCharacterCount === void 0 ? true : _a$withCharacterCount,
+    className = _a.className,
+    style = _a.style,
+    value = _a.value,
+    defaultValue = _a.defaultValue,
+    ariaRequired = _a['aria-required'],
+    ariaDescribedby = _a['aria-describedby'],
+    icon = _a.icon,
+    rest = __rest(_a, ["label", "disabled", "readOnly", "errorMessage", "tip", "required", "maxLength", "onChange", "id", "width", "componentSize", "type", "withCharacterCounter", "className", "style", "value", "defaultValue", 'aria-required', 'aria-describedby', "icon"]);
   var _useState = useState(getDefaultText(value, defaultValue)),
-      _useState2 = _slicedToArray(_useState, 2),
-      text = _useState2[0],
-      setText = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    text = _useState2[0],
+    setText = _useState2[1];
   var onChangeHandler = function onChangeHandler(event) {
     setText(event.target.value);
-
     if (onChange) {
       onChange(event);
     }
   };
-
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-textInput");
   var hasErrorMessage = !!errorMessage;

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

@@ -14,7 +14,7 @@ import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 
 var iconSizes = ddsBaseTokens.iconSizes;
 var input = textInputTokens.input,
-    icon = textInputTokens.icon;
+  icon = textInputTokens.icon;
 var MessageContainer = styled.div.withConfig({
   displayName: "TextInputstyles__MessageContainer",
   componentId: "sc-165zflr-0"
@@ -24,7 +24,7 @@ var StyledIcon = styled(Icon).withConfig({
   componentId: "sc-165zflr-1"
 })(["position:absolute;color:", ";", " z-index:1;"], icon.color, function (_ref) {
   var size = _ref.size,
-      iconSize = _ref.iconSize;
+    iconSize = _ref.iconSize;
   return css(["left:", ";", ""], icon.sizes[size].left, iconSize === 'small' ? css(["top:", ";"], "calc(50% - ".concat(iconSizes.DdsIconsizeSmallNumberPx / 2, "px)")) : css(["top:", ";;"], "calc(50% - ".concat(iconSizes.DdsIconsizeMediumNumberPx / 2, "px)")));
 });
 var StyledInput = styled(StatefulInput).withConfig({
@@ -32,7 +32,7 @@ var StyledInput = styled(StatefulInput).withConfig({
   componentId: "sc-165zflr-2"
 })(["", ""], function (_ref2) {
   var componentSize = _ref2.componentSize,
-      hasIcon = _ref2.hasIcon;
+    hasIcon = _ref2.hasIcon;
   return hasIcon && componentSize && css(["padding-left:", ";"], input.withIcon[componentSize].paddingLeft);
 });
 

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

@@ -1,8 +1,8 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 
 var colors = ddsBaseTokens.colors,
-    spacing = ddsBaseTokens.spacing,
-    iconSizes = ddsBaseTokens.iconSizes;
+  spacing = ddsBaseTokens.spacing,
+  iconSizes = ddsBaseTokens.iconSizes;
 var input = {
   withIcon: {
     medium: {

package/dist/components/ToggleBar/ToggleBar.js

@@ -37,26 +37,23 @@ var Bar = styled.div.withConfig({
 })(["display:grid;grid-auto-flow:column;grid-auto-columns:1fr;"]);
 var ToggleBar = function ToggleBar(props) {
   var children = props.children,
-      _props$size = props.size,
-      size = _props$size === void 0 ? 'medium' : _props$size,
-      label = props.label,
-      onChange = props.onChange,
-      value = props.value,
-      name = props.name,
-      width = props.width,
-      htmlProps = props.htmlProps,
-      className = props.className,
-      id = props.id,
-      rest = __rest(props, ["children", "size", "label", "onChange", "value", "name", "width", "htmlProps", "className", "id"]);
-
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'medium' : _props$size,
+    label = props.label,
+    onChange = props.onChange,
+    value = props.value,
+    name = props.name,
+    width = props.width,
+    htmlProps = props.htmlProps,
+    className = props.className,
+    id = props.id,
+    rest = __rest(props, ["children", "size", "label", "onChange", "value", "name", "width", "htmlProps", "className", "id"]);
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-ToggleBar");
-
   var _useState = useState(value),
-      _useState2 = _slicedToArray(_useState, 2),
-      groupValue = _useState2[0],
-      setGroupValue = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    groupValue = _useState2[0],
+    setGroupValue = _useState2[1];
   var handleChange = combineHandlers(function (e) {
     return setGroupValue(e.target.value);
   }, function (e) {

package/dist/components/ToggleBar/ToggleBar.tokens.js

@@ -3,10 +3,10 @@ import { calculateHeightWithLineHeight } from '../../utils/text.js';
 import '../../utils/color.js';
 
 var colors = ddsBaseTokens.colors,
-    spacing = ddsBaseTokens.spacing,
-    border = ddsBaseTokens.border,
-    borderRadius = ddsBaseTokens.borderRadius,
-    fontPackages = ddsBaseTokens.fontPackages;
+  spacing = ddsBaseTokens.spacing,
+  border = ddsBaseTokens.border,
+  borderRadius = ddsBaseTokens.borderRadius,
+  fontPackages = ddsBaseTokens.fontPackages;
 var typographyTypes = {
   large: 'bodySans04',
   medium: 'bodySans02',

package/dist/components/ToggleBar/ToggleRadio.js

@@ -23,42 +23,34 @@ import { Label, Content } from './ToggleRadio.styles.js';
  *
  * Returnerer false hvis verdiene er ulike eller hvis verdien i ToggleRadio er falsy.
  */
-
 var calculateChecked = function calculateChecked(value, group, checked) {
   if (typeof checked !== 'undefined') return checked;
-
   if (typeof value !== 'undefined' && value !== null && group) {
     if (typeof value === 'number') {
       return value === Number(group === null || group === void 0 ? void 0 : group.value);
     }
-
     return value === (group === null || group === void 0 ? void 0 : group.value);
   }
-
   return !!value;
 };
-
 var ToggleRadio = /*#__PURE__*/forwardRef(function (props, ref) {
   var value = props.value,
-      name = props.name,
-      onChange = props.onChange,
-      checked = props.checked,
-      icon = props.icon,
-      label = props.label,
-      htmlProps = props.htmlProps,
-      className = props.className,
-      id = props.id,
-      rest = __rest(props, ["value", "name", "onChange", "checked", "icon", "label", "htmlProps", "className", "id"]);
-
+    name = props.name,
+    onChange = props.onChange,
+    checked = props.checked,
+    icon = props.icon,
+    label = props.label,
+    htmlProps = props.htmlProps,
+    className = props.className,
+    id = props.id,
+    rest = __rest(props, ["value", "name", "onChange", "checked", "icon", "label", "htmlProps", "className", "id"]);
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-ToggleRadio");
   var group = useToggleBarContext();
-
   var handleChange = function handleChange(event) {
     onChange && onChange(event);
     group && group.onChange && group.onChange(event);
   };
-
   return jsxs(Label, Object.assign({
     size: group.size,
     htmlFor: uniqueId