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

package/dist/cjs/components/Link/Link.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const Link = React.forwardRef(({ asChild, children, className, inverted = false, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'a';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx('fds-link', className), ref: ref, "data-ds-theme": inverted ? 'dark' : undefined, ...rest, children: children }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx('fds-link', className), ref: ref, "data-ds-color-mode": inverted ? 'dark' : undefined, ...rest, children: children }));
 });
 Link.displayName = 'Link';
 

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

@@ -21,7 +21,7 @@ const Spinner = ({ title, variant = 'default', className, style, ...rest }) => {
     const strokeRef = useSynchronizedAnimation.useSynchronizedAnimation('fds-spinner-stroke-animation');
     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 })] }));
+            : 'fds-spinner--default', className), "data-ds-color-mode": 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,7 +77,7 @@ 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": inverted ? 'light' : 'dark', ...getFloatingProps({
+            })), internalOpen && (jsxRuntime.jsx(Container, { children: jsxRuntime.jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-color-mode": inverted ? 'light' : 'dark', ...getFloatingProps({
                         className: lite.clsx('fds-tooltip', className),
                         ref: mergedRef,
                         ...rest,

package/dist/cjs/components/form/NativeSelect/NativeSelect.js

@@ -14,7 +14,7 @@ var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
 const NativeSelect = React.forwardRef((props, ref) => {
     const { children, disabled = false, label, description, hideLabel = false, error, className, htmlSize = 0, ...rest } = props;
     const { selectProps, descriptionId, errorId, readOnly = false, size = 'md', } = useNativeSelect.useNativeSelect(props);
-    return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('fds-native-select--container', disabled && 'fds-native-select--disabled', readOnly && 'fds-native-select--readonly', error && 'fds-native-select--error'), children: [label && (jsxRuntime.jsxs(Label.Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: lite.clsx('fds-native-select__label', hideLabel && 'fds-sr-only'), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: 'fds-native-select__readonly__icon' })), label] })), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx(`fds-native-select__description`, hideLabel && `fds-sr-only`), children: description }) })), jsxRuntime.jsx("select", { disabled: disabled || readOnly, ref: ref, size: htmlSize, className: lite.clsx('fds-native-select', `fds-native-select--${size}`, `fds-focus`, props.multiple && 'fds-native-select--multiple', className), ...objectUtils.omit(['size', 'error', 'errorId'], rest), ...objectUtils.omit(['readOnly', 'disabled'], selectProps), children: children }), error && (jsxRuntime.jsx("div", { id: errorId, className: 'fds-native-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: error }) }))] }) }));
+    return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('fds-native-select--container', disabled && 'fds-native-select--disabled', readOnly && 'fds-native-select--readonly', error && 'fds-native-select--error'), children: [label && (jsxRuntime.jsxs(Label.Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: lite.clsx('fds-native-select__label', hideLabel && 'fds-sr-only'), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: 'fds-native-select__readonly__icon' })), label] })), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx(`fds-native-select__description`, hideLabel && `fds-sr-only`), children: description }) })), jsxRuntime.jsx("div", { className: 'fds-native-select__wrapper', children: jsxRuntime.jsx("select", { disabled: disabled || readOnly, ref: ref, size: htmlSize, className: lite.clsx('fds-native-select', `fds-native-select--${size}`, `fds-focus`, props.multiple && 'fds-native-select--multiple', className), ...objectUtils.omit(['size', 'error', 'errorId'], rest), ...objectUtils.omit(['readOnly', 'disabled'], selectProps), children: children }) }), error && (jsxRuntime.jsx("div", { id: errorId, className: 'fds-native-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: error }) }))] }) }));
 });
 NativeSelect.displayName = 'NativeSelect';
 

package/dist/esm/components/Link/Link.js

@@ -6,7 +6,7 @@ import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_mo
 
 const Link = forwardRef(({ asChild, children, className, inverted = false, ...rest }, ref) => {
     const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'a';
-    return (jsx(Component, { className: clsx('fds-link', className), ref: ref, "data-ds-theme": inverted ? 'dark' : undefined, ...rest, children: children }));
+    return (jsx(Component, { className: clsx('fds-link', className), ref: ref, "data-ds-color-mode": inverted ? 'dark' : undefined, ...rest, children: children }));
 });
 Link.displayName = 'Link';
 

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

@@ -19,7 +19,7 @@ const Spinner = ({ title, variant = 'default', className, style, ...rest }) => {
     const strokeRef = useSynchronizedAnimation('fds-spinner-stroke-animation');
     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 })] }));
+            : 'fds-spinner--default', className), "data-ds-color-mode": 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,7 +57,7 @@ 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": inverted ? 'light' : 'dark', ...getFloatingProps({
+            })), internalOpen && (jsx(Container, { children: jsxs("div", { ref: refs.setFloating, style: { ...floatingStyles, ...animationStyles, ...style }, role: 'tooltip', "data-ds-color-mode": inverted ? 'light' : 'dark', ...getFloatingProps({
                         className: clsx('fds-tooltip', className),
                         ref: mergedRef,
                         ...rest,

package/dist/esm/components/form/NativeSelect/NativeSelect.js

@@ -12,7 +12,7 @@ import { Paragraph } from '../../Typography/Paragraph/Paragraph.js';
 const NativeSelect = forwardRef((props, ref) => {
     const { children, disabled = false, label, description, hideLabel = false, error, className, htmlSize = 0, ...rest } = props;
     const { selectProps, descriptionId, errorId, readOnly = false, size = 'md', } = useNativeSelect(props);
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx('fds-native-select--container', disabled && 'fds-native-select--disabled', readOnly && 'fds-native-select--readonly', error && 'fds-native-select--error'), children: [label && (jsxs(Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: clsx('fds-native-select__label', hideLabel && 'fds-sr-only'), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'fds-native-select__readonly__icon' })), label] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: clsx(`fds-native-select__description`, hideLabel && `fds-sr-only`), children: description }) })), jsx("select", { disabled: disabled || readOnly, ref: ref, size: htmlSize, className: clsx('fds-native-select', `fds-native-select--${size}`, `fds-focus`, props.multiple && 'fds-native-select--multiple', className), ...omit(['size', 'error', 'errorId'], rest), ...omit(['readOnly', 'disabled'], selectProps), children: children }), error && (jsx("div", { id: errorId, className: 'fds-native-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsx(ErrorMessage, { size: size, children: error }) }))] }) }));
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx('fds-native-select--container', disabled && 'fds-native-select--disabled', readOnly && 'fds-native-select--readonly', error && 'fds-native-select--error'), children: [label && (jsxs(Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: clsx('fds-native-select__label', hideLabel && 'fds-sr-only'), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'fds-native-select__readonly__icon' })), label] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: clsx(`fds-native-select__description`, hideLabel && `fds-sr-only`), children: description }) })), jsx("div", { className: 'fds-native-select__wrapper', children: jsx("select", { disabled: disabled || readOnly, ref: ref, size: htmlSize, className: clsx('fds-native-select', `fds-native-select--${size}`, `fds-focus`, props.multiple && 'fds-native-select--multiple', className), ...omit(['size', 'error', 'errorId'], rest), ...omit(['readOnly', 'disabled'], selectProps), children: children }) }), error && (jsx("div", { id: errorId, className: 'fds-native-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsx(ErrorMessage, { size: size, children: error }) }))] }) }));
 });
 NativeSelect.displayName = 'NativeSelect';
 

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

@@ -6,7 +6,7 @@ export type LinkProps = {
     className?: string;
     /**
      * Inverts the color of the link. Use this on dark backgrounds.
-     * @deprecated Use `data-ds-theme="dark"` instead.
+     * @deprecated Use `data-ds-color-mode="dark"` instead.
      */
     inverted?: boolean;
     /** The URL that the link points to. This can also be an email address (starting with `mailto:`) or a phone number (staring with `tel:`). */
@@ -24,7 +24,7 @@ export declare const Link: import("react").ForwardRefExoticComponent<{
     className?: string | undefined;
     /**
      * Inverts the color of the link. Use this on dark backgrounds.
-     * @deprecated Use `data-ds-theme="dark"` instead.
+     * @deprecated Use `data-ds-color-mode="dark"` instead.
      */
     inverted?: boolean | undefined;
     /** The URL that the link points to. This can also be an email address (starting with `mailto:`) or a phone number (staring with `tel:`). */

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

@@ -25,7 +25,7 @@ export type TooltipProps = {
     defaultOpen?: boolean;
     /**
      * Inverts the color of the tooltip. Use this on dark backgrounds.
-     * @deprecated Use the `data-ds-theme` attribute instead.
+     * @deprecated Use the `data-ds-color-mode` attribute instead.
      */
     inverted?: boolean;
     /**
@@ -60,7 +60,7 @@ export declare const Tooltip: React.ForwardRefExoticComponent<{
     defaultOpen?: boolean | undefined;
     /**
      * Inverts the color of the tooltip. Use this on dark backgrounds.
-     * @deprecated Use the `data-ds-theme` attribute instead.
+     * @deprecated Use the `data-ds-color-mode` attribute instead.
      */
     inverted?: boolean | undefined;
     /**

package/dist/types/components/form/NativeSelect/NativeSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NativeSelect.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/NativeSelect/NativeSelect.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,SAAS,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAS3E,KAAK,oBAAoB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD,MAAM,MAAM,iBAAiB,GAAG;IAC9B;iDAC6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;SAGK;IACL,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;QAII;IACJ,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,oBAAoB,CAAC;IACjD,mCAAmC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC;AAE1D,eAAO,MAAM,YAAY;IAhCvB;iDAC6C;;IAE7C;;;SAGK;;IAEL;;OAEG;kBACW,SAAS;IACvB,gDAAgD;;IAEhD;;;;QAII;;IAEJ,mCAAmC;YAC3B,SAAS;IACjB;;OAEG;;IAEH;;OAEG;;6GAyGJ,CAAC"}
+{"version":3,"file":"NativeSelect.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/NativeSelect/NativeSelect.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,SAAS,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAS3E,KAAK,oBAAoB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD,MAAM,MAAM,iBAAiB,GAAG;IAC9B;iDAC6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;SAGK;IACL,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;QAII;IACJ,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,oBAAoB,CAAC;IACjD,mCAAmC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC;AAE1D,eAAO,MAAM,YAAY;IAhCvB;iDAC6C;;IAE7C;;;SAGK;;IAEL;;OAEG;kBACW,SAAS;IACvB,gDAAgD;;IAEhD;;;;QAII;;IAEJ,mCAAmC;YAC3B,SAAS;IACjB;;OAEG;;IAEH;;OAEG;;6GA2GJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digdir/designsystemet-react",
-  "version": "1.0.0-rc.1",
+  "version": "1.0.0-rc.3",
   "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": "8840f56d037879099652b2c7275ce08e93584f74"
+  "gitHead": "f9920518e77e01f2f77095ef30f8d4c62deafd51"
 }