@digdir/designsystemet-react 1.0.0-rc.0 → 1.0.0-rc.1

package/dist/cjs/components/ErrorSummary/ErrorSummaryHeading.js

@@ -13,7 +13,7 @@ const ErrorSummaryHeading = ({ id, ...rest }) => {
             setHeadingId(id);
         }
     }, [headingId, id, setHeadingId]);
-    return (jsxRuntime.jsx(index.List.Heading, { ...rest, id: headingId }));
+    return (jsxRuntime.jsx(index.List.Heading, { ...rest, id: headingId, className: 'fds-error-summary__heading' }));
 };
 ErrorSummaryHeading.displayName = 'ErrorSummaryHeading';
 

package/dist/cjs/components/SkipLink/SkipLink.js

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var lite = require('../../node_modules/clsx/dist/lite.js');
 
 const SkipLink = ({ href, children, className, ...rest }) => {
-    return (jsxRuntime.jsx("a", { href: href, className: lite.clsx(`fds-sr-only`, 'fds-skiplink', className), ...rest, children: children }));
+    return (jsxRuntime.jsx("a", { href: href, className: lite.clsx(`fds-sr-only`, 'fds-skiplink', className), ...rest, children: jsxRuntime.jsx("p", { className: 'fds-skiplink__content', children: children }) }));
 };
 SkipLink.displayName = 'SkipLink';
 

package/dist/cjs/components/Spinner/Spinner.js

@@ -19,7 +19,9 @@ const Spinner = ({ title, variant = 'default', className, style, ...rest }) => {
     const size = getSize.getSize(rest.size || 'md');
     const svgRef = useSynchronizedAnimation.useSynchronizedAnimation('fds-spinner-rotate-animation');
     const strokeRef = useSynchronizedAnimation.useSynchronizedAnimation('fds-spinner-stroke-animation');
-    return (jsxRuntime.jsxs("svg", { className: lite.clsx('fds-spinner', `fds-spinner--${variant}`, className), style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsxRuntime.jsx("title", { children: title }), jsxRuntime.jsx("circle", { className: lite.clsx('fds-spinner__background', variant === 'inverted' && 'fds-spinner__background--inverted'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsxRuntime.jsx("circle", { className: lite.clsx(`fds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
+    return (jsxRuntime.jsxs("svg", { className: lite.clsx('fds-spinner', variant !== 'inverted'
+            ? `fds-spinner--${variant}`
+            : 'fds-spinner--default', className), "data-ds-theme": variant === 'inverted' ? 'dark' : undefined, style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsxRuntime.jsx("title", { children: title }), jsxRuntime.jsx("circle", { className: lite.clsx('fds-spinner__background', variant === 'inverted' && 'fds-spinner__background--inverted'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsxRuntime.jsx("circle", { className: lite.clsx(`fds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
 };
 Spinner.displayName = 'Spinner';
 

package/dist/cjs/components/Tooltip/Tooltip.js

@@ -77,8 +77,8 @@ const Tooltip = React.forwardRef(({ children, content, placement = 'top', delay
     }
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [React.cloneElement(children, getReferenceProps({
                 ref: childMergedRef,
-            })), internalOpen && (jsxRuntime.jsx(Container, { children: jsxRuntime.jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-theme": 'dark', ...getFloatingProps({
-                        className: lite.clsx('fds-tooltip', inverted && 'fds-tooltip--inverted', className),
+            })), internalOpen && (jsxRuntime.jsx(Container, { children: jsxRuntime.jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-theme": inverted ? 'light' : 'dark', ...getFloatingProps({
+                        className: lite.clsx('fds-tooltip', className),
                         ref: mergedRef,
                         ...rest,
                     }), children: [content, jsxRuntime.jsx(floatingUi_react.FloatingArrow, { ref: arrowRef, context: context, className: 'fds-tooltip__arrow', height: ARROW_HEIGHT })] }) }))] }));

package/dist/esm/components/ErrorSummary/ErrorSummaryHeading.js

@@ -11,7 +11,7 @@ const ErrorSummaryHeading = ({ id, ...rest }) => {
             setHeadingId(id);
         }
     }, [headingId, id, setHeadingId]);
-    return (jsx(List.Heading, { ...rest, id: headingId }));
+    return (jsx(List.Heading, { ...rest, id: headingId, className: 'fds-error-summary__heading' }));
 };
 ErrorSummaryHeading.displayName = 'ErrorSummaryHeading';
 

package/dist/esm/components/SkipLink/SkipLink.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { clsx } from '../../node_modules/clsx/dist/lite.js';
 
 const SkipLink = ({ href, children, className, ...rest }) => {
-    return (jsx("a", { href: href, className: clsx(`fds-sr-only`, 'fds-skiplink', className), ...rest, children: children }));
+    return (jsx("a", { href: href, className: clsx(`fds-sr-only`, 'fds-skiplink', className), ...rest, children: jsx("p", { className: 'fds-skiplink__content', children: children }) }));
 };
 SkipLink.displayName = 'SkipLink';
 

package/dist/esm/components/Spinner/Spinner.js

@@ -17,7 +17,9 @@ const Spinner = ({ title, variant = 'default', className, style, ...rest }) => {
     const size = getSize(rest.size || 'md');
     const svgRef = useSynchronizedAnimation('fds-spinner-rotate-animation');
     const strokeRef = useSynchronizedAnimation('fds-spinner-stroke-animation');
-    return (jsxs("svg", { className: clsx('fds-spinner', `fds-spinner--${variant}`, className), style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsx("title", { children: title }), jsx("circle", { className: clsx('fds-spinner__background', variant === 'inverted' && 'fds-spinner__background--inverted'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsx("circle", { className: clsx(`fds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
+    return (jsxs("svg", { className: clsx('fds-spinner', variant !== 'inverted'
+            ? `fds-spinner--${variant}`
+            : 'fds-spinner--default', className), "data-ds-theme": variant === 'inverted' ? 'dark' : undefined, style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsx("title", { children: title }), jsx("circle", { className: clsx('fds-spinner__background', variant === 'inverted' && 'fds-spinner__background--inverted'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsx("circle", { className: clsx(`fds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
 };
 Spinner.displayName = 'Spinner';
 

package/dist/esm/components/Tooltip/Tooltip.js

@@ -57,8 +57,8 @@ const Tooltip = forwardRef(({ children, content, placement = 'top', delay = 150,
     }
     return (jsxs(Fragment, { children: [cloneElement(children, getReferenceProps({
                 ref: childMergedRef,
-            })), internalOpen && (jsx(Container, { children: jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-theme": 'dark', ...getFloatingProps({
-                        className: clsx('fds-tooltip', inverted && 'fds-tooltip--inverted', className),
+            })), internalOpen && (jsx(Container, { children: jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-theme": inverted ? 'light' : 'dark', ...getFloatingProps({
+                        className: clsx('fds-tooltip', className),
                         ref: mergedRef,
                         ...rest,
                     }), children: [content, jsx(FloatingArrow, { ref: arrowRef, context: context, className: 'fds-tooltip__arrow', height: ARROW_HEIGHT })] }) }))] }));

package/dist/types/components/ErrorSummary/ErrorSummaryHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorSummaryHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/ErrorSummary/ErrorSummaryHeading.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAKhD,MAAM,MAAM,wBAAwB,GAAG,gBAAgB,CAAC;AAExD,eAAO,MAAM,mBAAmB;sBAG7B,wBAAwB;;CAe1B,CAAC"}
+{"version":3,"file":"ErrorSummaryHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/ErrorSummary/ErrorSummaryHeading.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAKhD,MAAM,MAAM,wBAAwB,GAAG,gBAAgB,CAAC;AAExD,eAAO,MAAM,mBAAmB;sBAG7B,wBAAwB;;CAgB1B,CAAC"}

package/dist/types/components/Spinner/Spinner.d.ts

@@ -10,7 +10,11 @@ export type SpinnerProps = {
      * @note `xxsmall`, `xsmall`, `small`, `medium`, `large`, `xlarge` is deprecated
      */
     size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | OldSpinnerSizes;
-    /** Spinner appearance  */
+    /**
+     * Spinner appearance
+     * @default default
+     * @note `inverted` is deprecated
+     */
     variant?: 'default' | 'interaction' | 'inverted';
 } & React.ComponentPropsWithoutRef<'svg'>;
 /**  Spinner component used for indicating busy or indeterminate loading */

package/dist/types/components/Spinner/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,KAAK,eAAe,GAChB,SAAS,GACT,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,OAAO,GACP,QAAQ,CAAC;AAab,MAAM,MAAM,YAAY,GAAG;IACzB,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,eAAe,CAAC;IAClE,0BAA0B;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,UAAU,CAAC;CAClD,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAE1C,2EAA2E;AAC3E,eAAO,MAAM,OAAO;oDAMjB,YAAY,GAAG,WAAW;;CAgD5B,CAAC"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,KAAK,eAAe,GAChB,SAAS,GACT,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,OAAO,GACP,QAAQ,CAAC;AAab,MAAM,MAAM,YAAY,GAAG;IACzB,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,eAAe,CAAC;IAClE;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,UAAU,CAAC;CAClD,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAE1C,2EAA2E;AAC3E,eAAO,MAAM,OAAO;oDAMjB,YAAY,GAAG,WAAW;;CAuD5B,CAAC"}

package/dist/types/components/Tooltip/Tooltip.d.ts

@@ -23,7 +23,10 @@ export type TooltipProps = {
     open?: boolean;
     /** Whether the tooltip is open by default or not. */
     defaultOpen?: boolean;
-    /** Inverts the color of the tooltip. Use this on dark backgrounds. */
+    /**
+     * Inverts the color of the tooltip. Use this on dark backgrounds.
+     * @deprecated Use the `data-ds-theme` attribute instead.
+     */
     inverted?: boolean;
     /**
      * Portals the floating element outside of the app root and into the body.
@@ -55,7 +58,10 @@ export declare const Tooltip: React.ForwardRefExoticComponent<{
     open?: boolean | undefined;
     /** Whether the tooltip is open by default or not. */
     defaultOpen?: boolean | undefined;
-    /** Inverts the color of the tooltip. Use this on dark backgrounds. */
+    /**
+     * Inverts the color of the tooltip. Use this on dark backgrounds.
+     * @deprecated Use the `data-ds-theme` attribute instead.
+     */
     inverted?: boolean | undefined;
     /**
      * Portals the floating element outside of the app root and into the body.

package/dist/types/components/Tooltip/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuB/B,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAChE,6BAA6B;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAChD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,qDAAqD;IACrD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO;IAhClB;;;OAGG;cACO,MAAM,YAAY,GAAG,MAAM,aAAa,CAAC,WAAW,CAAC;IAC/D,6BAA6B;aACpB,MAAM;IACf;;;OAGG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH,qDAAqD;;IAErD,sEAAsE;;IAEtE;;;;OAIG;;yEAoHJ,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuB/B,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAChE,6BAA6B;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAChD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,qDAAqD;IACrD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO;IAnClB;;;OAGG;cACO,MAAM,YAAY,GAAG,MAAM,aAAa,CAAC,WAAW,CAAC;IAC/D,6BAA6B;aACpB,MAAM;IACf;;;OAGG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH,qDAAqD;;IAErD;;;OAGG;;IAEH;;;;OAIG;;yEAgHJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digdir/designsystemet-react",
-  "version": "1.0.0-rc.0",
+  "version": "1.0.0-rc.1",
   "description": "React components for Designsystemet",
   "author": "Designsystemet team",
   "repository": "https://github.com/digdir/designsystemet",
@@ -39,5 +39,5 @@
     "rollup": "^4.12.1",
     "typescript": "^5.4.2"
   },
-  "gitHead": "723484e5f436a871a22d426935389ef198bc1346"
+  "gitHead": "8840f56d037879099652b2c7275ce08e93584f74"
 }