@navikt/ds-react 0.12.3 → 0.13.3

package/esm/form/search-field/SearchField.js

@@ -21,11 +21,14 @@ export const SearchFieldContext = React.createContext(null);
 const SearchField = forwardRef((props, ref) => {
     const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "searchfield");
     const { className, hideLabel, children, label, description, error } = props, rest = __rest(props, ["className", "hideLabel", "children", "label", "description", "error"]);
-    return (React.createElement("div", Object.assign({ ref: ref }, omit(rest, ["id", "error", "errorId", "size", "disabled"]), { className: cl(className, "navds-form-field", `navds-form-field--${size !== null && size !== void 0 ? size : "medium"}`, "navds-search-field", { "navds-search-field--error": hasError }) }),
+    return (React.createElement("div", Object.assign({ ref: ref }, omit(rest, ["id", "error", "errorId", "size", "disabled"]), { className: cl(className, "navds-form-field", `navds-form-field--${size !== null && size !== void 0 ? size : "medium"}`, "navds-search-field", {
+            "navds-search-field--error": hasError,
+            "navds-search-field--disabled": !!inputProps.disabled,
+        }) }),
         React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-text-field__label", {
                 "sr-only": hideLabel,
             }) }, label),
-        !!description && (React.createElement(BodyShort, { className: cl("navds-text-field__description", {
+        !!description && (React.createElement(BodyShort, { as: "div", className: cl("navds-text-field__description", {
                 "sr-only": hideLabel,
             }), id: inputDescriptionId, size: size }, description)),
         React.createElement("div", { className: "navds-search-field__input-wrapper" },

package/esm/form/search-field/SearchField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchField.js","sourceRoot":"","sources":["../../../src/form/search-field/SearchField.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAkB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,iBAA4C,MAAM,qBAAqB,CAAC;AAC/E,OAAO,sBAEN,MAAM,0BAA0B,CAAC;AAClC,OAAO,gBAA0C,MAAM,oBAAoB,CAAC;AAY5E,MAAM,CAAC,MAAM,kBAAkB,GAAG,KAAK,CAAC,aAAa,CACnD,IAAI,CACL,CAAC;AA4BF,MAAM,WAAW,GAAG,UAAU,CAC5B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,YAAY,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAEvC,MAAM,EACJ,SAAS,EACT,SAAS,EACT,QAAQ,EACR,KAAK,EACL,WAAW,EACX,KAAK,KAEH,KAAK,EADJ,IAAI,UACL,KAAK,EARH,uEAQL,CAAQ,CAAC;IAEV,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,IACJ,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,IAC9D,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,QAAQ,EAAE,EACvC,oBAAoB,EACpB,EAAE,2BAA2B,EAAE,QAAQ,EAAE,CAC1C;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,SAAS,EAAE,SAAS;aACrB,CAAC,IAED,KAAK,CACA;QACP,CAAC,CAAC,WAAW,IAAI,CAChB,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,SAAS,EAAE,SAAS;aACrB,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAE,IAAI,IAET,WAAW,CACF,CACb;QACD,6BAAK,SAAS,EAAC,mCAAmC;YAChD,oBAAC,kBAAkB,CAAC,QAAQ,IAC1B,KAAK,EAAE;oBACL,UAAU;oBACV,IAAI;iBACL,IAEA,QAAQ,CACmB,CAC1B;QACN,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,YAAY,IAAI,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAgB,CAC7D,CACF,CACP,CAAC;AACJ,CAAC,CACsB,CAAC;AAE1B,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;AACvC,WAAW,CAAC,KAAK,GAAG,sBAAsB,CAAC;AAC3C,WAAW,CAAC,KAAK,GAAG,gBAAgB,CAAC;AAErC,eAAe,WAAW,CAAC"}
+{"version":3,"file":"SearchField.js","sourceRoot":"","sources":["../../../src/form/search-field/SearchField.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAkB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,iBAA4C,MAAM,qBAAqB,CAAC;AAC/E,OAAO,sBAEN,MAAM,0BAA0B,CAAC;AAClC,OAAO,gBAA0C,MAAM,oBAAoB,CAAC;AAY5E,MAAM,CAAC,MAAM,kBAAkB,GAAG,KAAK,CAAC,aAAa,CACnD,IAAI,CACL,CAAC;AA4BF,MAAM,WAAW,GAAG,UAAU,CAC5B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,YAAY,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAEvC,MAAM,EACJ,SAAS,EACT,SAAS,EACT,QAAQ,EACR,KAAK,EACL,WAAW,EACX,KAAK,KAEH,KAAK,EADJ,IAAI,UACL,KAAK,EARH,uEAQL,CAAQ,CAAC;IAEV,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,IACJ,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,IAC9D,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,QAAQ,EAAE,EACvC,oBAAoB,EACpB;YACE,2BAA2B,EAAE,QAAQ;YACrC,8BAA8B,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;SACtD,CACF;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,SAAS,EAAE,SAAS;aACrB,CAAC,IAED,KAAK,CACA;QACP,CAAC,CAAC,WAAW,IAAI,CAChB,oBAAC,SAAS,IACR,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,SAAS,EAAE,SAAS;aACrB,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAE,IAAI,IAET,WAAW,CACF,CACb;QACD,6BAAK,SAAS,EAAC,mCAAmC;YAChD,oBAAC,kBAAkB,CAAC,QAAQ,IAC1B,KAAK,EAAE;oBACL,UAAU;oBACV,IAAI;iBACL,IAEA,QAAQ,CACmB,CAC1B;QACN,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,YAAY,IAAI,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAgB,CAC7D,CACF,CACP,CAAC;AACJ,CAAC,CACsB,CAAC;AAE1B,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;AACvC,WAAW,CAAC,KAAK,GAAG,sBAAsB,CAAC;AAC3C,WAAW,CAAC,KAAK,GAAG,gBAAgB,CAAC;AAErC,eAAe,WAAW,CAAC"}

package/esm/loader/Loader.d.ts

@@ -18,5 +18,5 @@ export interface LoaderProps extends SVGProps<SVGSVGElement> {
      */
     variant?: "neutral" | "interaction" | "inverted";
 }
-declare const Loader: React.ForwardRefExoticComponent<Pick<LoaderProps, "string" | "filter" | "values" | "fill" | "max" | "type" | "transparent" | "accumulate" | "offset" | "key" | "id" | "media" | "origin" | "height" | "width" | "end" | "name" | "alignmentBaseline" | "baselineShift" | "clip" | "clipPath" | "clipRule" | "color" | "colorInterpolation" | "colorInterpolationFilters" | "cursor" | "direction" | "display" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "imageRendering" | "letterSpacing" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "opacity" | "order" | "overflow" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "textDecoration" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "wordSpacing" | "writingMode" | "alphabetic" | "hanging" | "ideographic" | "style" | "title" | "path" | "method" | "target" | "lang" | "className" | "children" | "tabIndex" | "size" | "orientation" | "local" | "x" | "y" | "mathematical" | "azimuth" | "colorRendering" | "glyphOrientationVertical" | "vectorEffect" | "additive" | "crossOrigin" | "href" | "min" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "accentHeight" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant"> & React.RefAttributes<SVGSVGElement>>;
+declare const Loader: React.ForwardRefExoticComponent<Pick<LoaderProps, "string" | "filter" | "values" | "fill" | "max" | "type" | "transparent" | "accumulate" | "offset" | "key" | "id" | "media" | "origin" | "height" | "width" | "end" | "name" | "alignmentBaseline" | "baselineShift" | "clip" | "clipPath" | "clipRule" | "color" | "colorInterpolation" | "colorInterpolationFilters" | "cursor" | "direction" | "display" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "imageRendering" | "letterSpacing" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "opacity" | "order" | "overflow" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "textDecoration" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "wordSpacing" | "writingMode" | "alphabetic" | "hanging" | "ideographic" | "style" | "title" | "path" | "method" | "target" | "lang" | "className" | "children" | "tabIndex" | "size" | "orientation" | "local" | "x" | "y" | "mathematical" | "azimuth" | "colorRendering" | "glyphOrientationVertical" | "vectorEffect" | "additive" | "crossOrigin" | "href" | "min" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "accentHeight" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "fr" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant"> & React.RefAttributes<SVGSVGElement>>;
 export default Loader;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "0.12.3",
+  "version": "0.13.3",
   "private": false,
   "description": "NAV designsystem react components",
   "author": "NAV Designsystem team",
@@ -35,7 +35,7 @@
   },
   "dependencies": {
     "@material-ui/core": "^4.12.3",
-    "@navikt/ds-icons": "^0.6.2",
+    "@navikt/ds-icons": "^0.6.3",
     "@popperjs/core": "^2.10.1",
     "classnames": "^2.2.6",
     "react-collapse": "^5.1.0",
@@ -63,5 +63,5 @@
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0"
   },
-  "gitHead": "39c4c751d85b00b1857a33e82ac5768bed42144a"
+  "gitHead": "f6c4f853afefa13244fe3f9bd55126d7caaa0b70"
 }

package/src/form/Fieldset/Fieldset.tsx

@@ -1,6 +1,6 @@
 import cl from "classnames";
 import React, { FieldsetHTMLAttributes, forwardRef, useContext } from "react";
-import { BodyShort, Label, omit } from "../..";
+import { BodyShort, Detail, Label, omit } from "../..";
 import ErrorMessage from "../ErrorMessage";
 import { FormFieldProps } from "../useFormField";
 import { useFieldset } from "./useFieldset";
@@ -101,17 +101,30 @@ const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(
           >
             {legend}
           </Label>
-          {!!description && (
-            <BodyShort
-              className={cl("navds-fieldset__description", {
-                "sr-only": !!hideLegend,
-              })}
-              id={inputDescriptionId}
-              size={size}
-            >
-              {description}
-            </BodyShort>
-          )}
+          {!!description &&
+            (size === "medium" ? (
+              <BodyShort
+                className={cl("navds-fieldset__description", {
+                  "sr-only": !!hideLegend,
+                })}
+                id={inputDescriptionId}
+                size="small"
+                as="div"
+              >
+                {props.description}
+              </BodyShort>
+            ) : (
+              <Detail
+                className={cl("navds-fieldset__description", {
+                  "sr-only": !!hideLegend,
+                })}
+                id={inputDescriptionId}
+                size="small"
+                as="div"
+              >
+                {props.description}
+              </Detail>
+            ))}
           {children}
           <div
             id={errorId}

package/src/form/Select.tsx

@@ -52,7 +52,10 @@ const Select = forwardRef<HTMLSelectElement, SelectProps>((props, ref) => {
         className,
         "navds-form-field",
         `navds-form-field--${size}`,
-        { "navds-select--error": hasError }
+        {
+          "navds-select--error": hasError,
+          "navds-select--disabled": !!inputProps.disabled,
+        }
       )}
     >
       <Label
@@ -67,6 +70,7 @@ const Select = forwardRef<HTMLSelectElement, SelectProps>((props, ref) => {
       </Label>
       {!!description && (
         <BodyShort
+          as="div"
           className={cl("navds-select__description", {
             "sr-only": hideLabel,
           })}

package/src/form/TextField.tsx

@@ -1,6 +1,6 @@
 import React, { forwardRef, InputHTMLAttributes } from "react";
 import cl from "classnames";
-import { BodyShort, Label, omit } from "..";
+import { BodyShort, Detail, Label, omit } from "..";
 import ErrorMessage from "./ErrorMessage";
 import { FormFieldProps, useFormField } from "./useFormField";
 
@@ -52,7 +52,10 @@ const TextField = forwardRef<HTMLInputElement, TextFieldProps>((props, ref) => {
         className,
         "navds-form-field",
         `navds-form-field--${size}`,
-        { "navds-text-field--error": hasError }
+        {
+          "navds-text-field--error": hasError,
+          "navds-text-field--disabled": !!inputProps.disabled,
+        }
       )}
     >
       <Label
@@ -65,15 +68,31 @@ const TextField = forwardRef<HTMLInputElement, TextFieldProps>((props, ref) => {
       </Label>
 
       {!!description && (
-        <BodyShort
-          className={cl("navds-text-field__description", {
-            "sr-only": hideLabel,
-          })}
-          id={inputDescriptionId}
-          size={size}
-        >
-          {description}
-        </BodyShort>
+        <>
+          {size === "medium" ? (
+            <BodyShort
+              className={cl("navds-text-field__description", {
+                "sr-only": hideLabel,
+              })}
+              id={inputDescriptionId}
+              size="small"
+              as="div"
+            >
+              {description}
+            </BodyShort>
+          ) : (
+            <Detail
+              className={cl("navds-text-field__description", {
+                "sr-only": hideLabel,
+              })}
+              id={inputDescriptionId}
+              size="small"
+              as="div"
+            >
+              {description}
+            </Detail>
+          )}
+        </>
       )}
       <input
         {...omit(rest, ["error", "errorId", "size"])}

package/src/form/Textarea.tsx

@@ -66,7 +66,10 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
           className,
           "navds-form-field",
           `navds-form-field--${size}`,
-          { "navds-textarea--error": hasError }
+          {
+            "navds-textarea--error": hasError,
+            "navds-textarea--disabled": !!inputProps.disabled,
+          }
         )}
       >
         <Label
@@ -81,6 +84,7 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
         </Label>
         {!!description && (
           <BodyShort
+            as="div"
             className={cl("navds-textarea__description", {
               "sr-only": hideLabel,
             })}

package/src/form/checkbox/Checkbox.test.tsx

@@ -29,10 +29,7 @@ test("checkbox group chains onChange calls", () => {
 });
 
 describe("Checkbox handles controlled-state correctly", () => {
-  const CheckboxComponent = ({
-    onChange = () => null,
-    value,
-  }) => (
+  const CheckboxComponent = ({ onChange = () => null, value }) => (
     <CheckboxGroup legend="legend" onChange={onChange} value={value}>
       <Checkbox value={"value1"}>label1</Checkbox>
       <Checkbox value={"value2"}>label2</Checkbox>
@@ -55,7 +52,12 @@ describe("Checkbox handles controlled-state correctly", () => {
   test("onChange called with expected values", () => {
     const onGroupChange = jest.fn();
 
-    render(<CheckboxComponent onChange={onGroupChange} value={["value1", "value2"]} />);
+    render(
+      <CheckboxComponent
+        onChange={onGroupChange}
+        value={["value1", "value2"]}
+      />
+    );
 
     userEvent.click(screen.getByLabelText("label1"));
 

package/src/form/checkbox/Checkbox.tsx

@@ -1,13 +1,17 @@
 import React, { forwardRef, InputHTMLAttributes } from "react";
 import cl from "classnames";
 import useCheckbox from "./useCheckbox";
-import ErrorMessage from "../ErrorMessage";
 import { FormFieldProps } from "../useFormField";
-import { BodyShort, omit } from "../..";
+import { BodyShort, Detail, omit } from "../..";
 
 export interface CheckboxProps
-  extends FormFieldProps,
+  extends Omit<FormFieldProps, "errorId">,
     Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+  /**
+   * Checkbox has error
+   * @default false
+   */
+  error?: boolean;
   /**
    * Label for checkbox
    */
@@ -23,14 +27,9 @@ export interface CheckboxProps
 }
 
 const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
-  const {
-    inputProps,
-    errorId,
-    showErrorMsg,
-    hasError,
-    size,
-    inputDescriptionId,
-  } = useCheckbox(props);
+  const { inputProps, hasError, size } = useCheckbox(props);
+
+  const Description = size === "medium" ? BodyShort : Detail;
 
   return (
     <div
@@ -40,8 +39,7 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
         `navds-checkbox--${size}`,
         {
           "navds-checkbox--error": hasError,
-          "navds-checkbox--with-error-message": showErrorMsg,
-          "navds-checkbox--with-description": !!props.description,
+          "navds-checkbox--disabled": inputProps.disabled,
         }
       )}
     >
@@ -50,7 +48,6 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
           "children",
           "size",
           "error",
-          "errorId",
           "description",
           "hideLabel",
         ])}
@@ -58,30 +55,26 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
         className="navds-checkbox__input"
         ref={ref}
       />
-      <BodyShort
-        as="label"
-        htmlFor={inputProps.id}
-        size={size}
-        className="navds-checkbox__label"
-      >
-        {props.hideLabel ? (
-          <span className="sr-only">{props.children}</span>
-        ) : (
-          props.children
-        )}
-      </BodyShort>
-      {props.description && (
-        <BodyShort
-          size={size}
-          id={inputDescriptionId}
-          className="navds-checkbox__description"
+      <label htmlFor={inputProps.id} className="navds-checkbox__label">
+        <div
+          className={cl("navds-checkbox__content", {
+            "sr-only": props.hideLabel,
+          })}
         >
-          {props.description}
-        </BodyShort>
-      )}
-      <div id={errorId} aria-relevant="additions removals" aria-live="polite">
-        {showErrorMsg && <ErrorMessage size={size}>{props.error}</ErrorMessage>}
-      </div>
+          <BodyShort as="div" size={size}>
+            {props.children}
+          </BodyShort>
+          {props.description && (
+            <Description
+              as="div"
+              size="small"
+              className="navds-checkbox__description"
+            >
+              {props.description}
+            </Description>
+          )}
+        </div>
+      </label>
     </div>
   );
 });

package/src/form/checkbox/CheckboxGroup.tsx

@@ -12,7 +12,8 @@ export const CheckboxGroupContext = createContext<CheckboxGroupState | null>(
   null
 );
 
-export interface CheckboxGroupProps extends Omit<FieldsetProps, "onChange"> {
+export interface CheckboxGroupProps
+  extends Omit<FieldsetProps, "onChange" | "errorPropagation"> {
   /**
    * Checkboxes
    */

package/src/form/checkbox/stories/checkbox.stories.mdx

@@ -49,6 +49,8 @@ Man kan både sette en description på CheckboxGroup og selve checkbox
 
 ## Errors
 
+Feilmeldinger kan bare settes på gruppa
+
 ```jsx
 <CheckboxGroup legend="Mollit eiusmod" error="Boks nr 2 må være valgt">
   <Checkbox value="Apple">Apple</Checkbox>
@@ -65,37 +67,23 @@ Man kan både sette en description på CheckboxGroup og selve checkbox
   </CheckboxGroup>
 </Canvas>
 
-## Errors uten errorPropagation
+Enkelt-checkboxer tar en `boolean` error prop
 
 ```jsx
-<CheckboxGroup
-  legend="Mollit eiusmod"
-  errorPropagation={false}
-  error="Boks nr 2 må være valgt"
->
-  <Checkbox value="Apple">Apple</Checkbox>
-  <Checkbox value="Orange">Orange</Checkbox>
-  <Checkbox value="Melon">Melon</Checkbox>
-</CheckboxGroup>
+<Checkbox value="Apple" error>
+  Apple
+</Checkbox>
 ```
 
 <Canvas>
-  <CheckboxGroup
-    legend="Mollit eiusmod"
-    errorPropagation={false}
-    error="Boks nr 2 må være valgt"
-  >
-    <Checkbox value="Apple">Apple</Checkbox>
-    <Checkbox value="Orange" error="Boksen må være valgt">
-      Orange
-    </Checkbox>
-    <Checkbox value="Melon">Melon</Checkbox>
-  </CheckboxGroup>
+  <Checkbox value="Apple" error>
+    Apple
+  </Checkbox>
 </Canvas>
 
 ## Sizing
 
-Checkboxer har default 44px høy klikkflate. Med size="small" blir denne til 24px slik som før
+Checkboxer har default 48px høy klikkflate. Med size="small" blir klikkflaten 32px
 
 ```jsx
 <CheckboxGroup
@@ -166,31 +154,15 @@ Ved bruk av `hideLegend` på CheckboxGroup kan man gjøre slik at legend/descrip
 Ved bruk av `hideLabel` kan man lettere ta i bruk checkbox internt i eks tabeller.
 
 ```jsx
-<CheckboxGroup legend="Mollit eiusmod" hideLegend>
-  <Checkbox value="Apple" hideLabel>
-    Apple
-  </Checkbox>
-  <Checkbox value="Orange" hideLabel>
-    Orange
-  </Checkbox>
-  <Checkbox value="Melon" hideLabel>
-    Melon
-  </Checkbox>
-</CheckboxGroup>
+<Checkbox value="Orange" hideLabel>
+  Orange
+</Checkbox>
 ```
 
 <Canvas>
-  <CheckboxGroup legend="Mollit eiusmod" hideLegend>
-    <Checkbox value="Apple" hideLabel>
-      Apple
-    </Checkbox>
-    <Checkbox value="Orange" hideLabel>
-      Orange
-    </Checkbox>
-    <Checkbox value="Melon" hideLabel>
-      Melon
-    </Checkbox>
-  </CheckboxGroup>
+  <Checkbox value="Orange" hideLabel>
+    Orange
+  </Checkbox>
 </Canvas>
 
 ## Disabled
@@ -206,7 +178,7 @@ NOTE: Husk at disabled bør unngås!
   <Checkbox value="Melon">Melon</Checkbox>
 </CheckboxGroup>
 
-<CheckboxGroup legend="Mollit eiusmod" >
+<CheckboxGroup legend="Mollit eiusmod">
   <Checkbox value="Apple" disabled>Apple</Checkbox>
   <Checkbox value="Orange">Orange</Checkbox>
   <Checkbox value="Melon">Melon</Checkbox>