npm - @dnb/eufemia - Versions diffs - 10.22.0 → 10.24.0 - Mend

@dnb/eufemia 10.22.0 → 10.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1233) hide show

package/cjs/components/skeleton/SkeletonHelper.d.ts CHANGED Viewed

@@ -1,15 +1,15 @@
 import * as React from 'react';
 import type { SkeletonShow } from './Skeleton';
-export interface AutoSizeProps {
+export type AutoSizeProps = {
   __element?: React.ReactNode;
   children?: React.ReactNode;
   className?: string;
   style?: React.CSSProperties;
-}
+};
 export class AutoSize extends React.Component<AutoSizeProps, any> {
   render(): JSX.Element;
 }
-export interface SkeletonContextProps {
+export type SkeletonContextProps = ContextProps & {
   translation?: {
     Skeleton?: {
       /**
@@ -18,14 +18,14 @@ export interface SkeletonContextProps {
       aria_busy: string;
     };
   };
-}
+};
 export type SkeletonMethods = 'shape' | 'font' | 'code';
 export declare const createSkeletonClass: (
   method: SkeletonMethods,
   skeleton: SkeletonShow,
   context?: SkeletonContextProps
 ) => string;
-export interface skeletonDOMAttributesContext {
+export type skeletonDOMAttributesContext = {
   translation?: {
     Skeleton: {
       /**
@@ -34,7 +34,7 @@ export interface skeletonDOMAttributesContext {
       aria_busy: string;
     };
   };
-}
+};
 export declare const skeletonDOMAttributes: (
   params: React.HTMLProps<HTMLElement>,
   skeleton: SkeletonShow,

package/cjs/components/skeleton/style/dnb-skeleton.css CHANGED Viewed

@@ -68,6 +68,7 @@
   --font-family-monospace: "DNBMonoSkeleton" !important;
   font-family: var(--font-family-monospace) !important;
   font-style: unset !important;
+  box-shadow: none !important;
 }
 .dnb-skeleton--font-only, .dnb-skeleton--font, .dnb-skeleton--font .dnb-skeleton--show-font, .dnb-skeleton--font .dnb-p {
   pointer-events: none;

package/cjs/components/skeleton/style/dnb-skeleton.min.css CHANGED Viewed

	@@ -1 +1 @@
1	- .dnb-skeleton{--skeleton-delay:5s}.dnb-skeleton img,.dnb-skeleton video{filter:brightness(0) contrast(0) opacity(.5)}.dnb-skeleton--block{display:block}.dnb-skeleton--overflow{overflow:hidden}.dnb-skeleton--grey{filter:grayscale(100%)}.dnb-skeleton--shape{background:transparent;box-shadow:none!important;color:transparent;overflow-x:hidden;pointer-events:none;position:relative}.dnb-skeleton--shape.dnb-skeleton:after,.dnb-skeleton--shape.dnb-skeleton:before{background:none!important;border-radius:inherit;bottom:0!important;box-shadow:none!important;content:""!important;height:auto!important;left:0!important;margin:0!important;padding:0!important;position:absolute!important;right:0!important;top:0!important;width:100%!important;z-index:100!important}.dnb-skeleton--shape.dnb-skeleton:before{background-color:var(--skeleton-color)!important}.dnb-skeleton--shape.dnb-skeleton:after{animation:skeletonLinearAnimation 1.5s linear infinite var(--skeleton-delay);background-image:repeating-linear-gradient(-45deg,var(--skeleton-color--contrast) 1px 2px,transparent 0 6px)!important;background-repeat:repeat!important;background-size:100%!important;-webkit-clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}.dnb-skeleton--code code,.dnb-skeleton--code code ,.dnb-skeleton--code pre,.dnb-skeleton--code pre ,.dnb-skeleton--font code,.dnb-skeleton--font code ,.dnb-skeleton--font pre,.dnb-skeleton--font pre {--font-family-monospace:"DNBMonoSkeleton"!important;font-family:var(--font-family-monospace)!important;font-style:unset!important}.dnb-skeleton--font,.dnb-skeleton--font .dnb-p,.dnb-skeleton--font .dnb-skeleton--show-font,.dnb-skeleton--font-only{--font-family-default:"DNBSkeleton"!important;font-family:var(--font-family-default)!important;font-style:unset!important;pointer-events:none}.dnb-skeleton--font .dnb-p::marker,.dnb-skeleton--font .dnb-skeleton--show-font::marker,.dnb-skeleton--font-only::marker,.dnb-skeleton--font::marker{color:var(--skeleton-color)}.dnb-skeleton--font,.dnb-skeleton--font .dnb-p,.dnb-skeleton--font .dnb-skeleton--show-font{-webkit-text-fill-color:transparent!important;--border-color:var(--skeleton-color);animation:skeletonFontAnimation 5s linear infinite var(--skeleton-delay);-webkit-background-clip:text!important;background-clip:text!important;background-color:var(--skeleton-color)!important;background-image:repeating-linear-gradient(-45deg,var(--skeleton-color--contrast) 1px 2px,transparent 0 6px)!important;background-position-x:30rem;background-position-y:50%!important;background-repeat:no-repeat!important;background-size:30rem 100%!important}html[data-visual-test] .dnb-skeleton--font,html[data-visual-test] .dnb-skeleton--font .dnb-p,html[data-visual-test] .dnb-skeleton--font .dnb-skeleton--show-font{animation:none!important}.dnb-skeleton__figure{border-radius:.25rem;position:relative}.dnb-skeleton__figure--circle{border-radius:50%;height:4rem;width:4rem}.dnb-skeleton__figure--product{align-items:center;display:flex}.dnb-skeleton__figure--product .dnb-skeleton__figure--circle+div{margin-left:1rem;width:50%}.dnb-skeleton--no-animation * .dnb-skeleton:after,.dnb-skeleton--no-animation .dnb-skeleton,.dnb-skeleton--no-animation .dnb-skeleton:after{animation:none!important}@keyframes skeletonLinearAnimation{0%{-webkit-clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}50%{-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}to{-webkit-clip-path:polygon(0 0,0 0,0 100%,0 100%);clip-path:polygon(0 0,0 0,0 100%,0 100%)}}@keyframes skeletonFontAnimation{0%{background-position-x:30rem}to{background-position-x:-30rem}}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:400;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:500;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:600;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBMonoSkeleton;font-style:normal;font-weight:400;src:url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.ttf) format("truetype")}
1	+ .dnb-skeleton{--skeleton-delay:5s}.dnb-skeleton img,.dnb-skeleton video{filter:brightness(0) contrast(0) opacity(.5)}.dnb-skeleton--block{display:block}.dnb-skeleton--overflow{overflow:hidden}.dnb-skeleton--grey{filter:grayscale(100%)}.dnb-skeleton--shape{background:transparent;box-shadow:none!important;color:transparent;overflow-x:hidden;pointer-events:none;position:relative}.dnb-skeleton--shape.dnb-skeleton:after,.dnb-skeleton--shape.dnb-skeleton:before{background:none!important;border-radius:inherit;bottom:0!important;box-shadow:none!important;content:""!important;height:auto!important;left:0!important;margin:0!important;padding:0!important;position:absolute!important;right:0!important;top:0!important;width:100%!important;z-index:100!important}.dnb-skeleton--shape.dnb-skeleton:before{background-color:var(--skeleton-color)!important}.dnb-skeleton--shape.dnb-skeleton:after{animation:skeletonLinearAnimation 1.5s linear infinite var(--skeleton-delay);background-image:repeating-linear-gradient(-45deg,var(--skeleton-color--contrast) 1px 2px,transparent 0 6px)!important;background-repeat:repeat!important;background-size:100%!important;-webkit-clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}.dnb-skeleton--code code,.dnb-skeleton--code code ,.dnb-skeleton--code pre,.dnb-skeleton--code pre ,.dnb-skeleton--font code,.dnb-skeleton--font code ,.dnb-skeleton--font pre,.dnb-skeleton--font pre {--font-family-monospace:"DNBMonoSkeleton"!important;box-shadow:none!important;font-family:var(--font-family-monospace)!important;font-style:unset!important}.dnb-skeleton--font,.dnb-skeleton--font .dnb-p,.dnb-skeleton--font .dnb-skeleton--show-font,.dnb-skeleton--font-only{--font-family-default:"DNBSkeleton"!important;font-family:var(--font-family-default)!important;font-style:unset!important;pointer-events:none}.dnb-skeleton--font .dnb-p::marker,.dnb-skeleton--font .dnb-skeleton--show-font::marker,.dnb-skeleton--font-only::marker,.dnb-skeleton--font::marker{color:var(--skeleton-color)}.dnb-skeleton--font,.dnb-skeleton--font .dnb-p,.dnb-skeleton--font .dnb-skeleton--show-font{-webkit-text-fill-color:transparent!important;--border-color:var(--skeleton-color);animation:skeletonFontAnimation 5s linear infinite var(--skeleton-delay);-webkit-background-clip:text!important;background-clip:text!important;background-color:var(--skeleton-color)!important;background-image:repeating-linear-gradient(-45deg,var(--skeleton-color--contrast) 1px 2px,transparent 0 6px)!important;background-position-x:30rem;background-position-y:50%!important;background-repeat:no-repeat!important;background-size:30rem 100%!important}html[data-visual-test] .dnb-skeleton--font,html[data-visual-test] .dnb-skeleton--font .dnb-p,html[data-visual-test] .dnb-skeleton--font .dnb-skeleton--show-font{animation:none!important}.dnb-skeleton__figure{border-radius:.25rem;position:relative}.dnb-skeleton__figure--circle{border-radius:50%;height:4rem;width:4rem}.dnb-skeleton__figure--product{align-items:center;display:flex}.dnb-skeleton__figure--product .dnb-skeleton__figure--circle+div{margin-left:1rem;width:50%}.dnb-skeleton--no-animation * .dnb-skeleton:after,.dnb-skeleton--no-animation .dnb-skeleton,.dnb-skeleton--no-animation .dnb-skeleton:after{animation:none!important}@keyframes skeletonLinearAnimation{0%{-webkit-clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}50%{-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}to{-webkit-clip-path:polygon(0 0,0 0,0 100%,0 100%);clip-path:polygon(0 0,0 0,0 100%,0 100%)}}@keyframes skeletonFontAnimation{0%{background-position-x:30rem}to{background-position-x:-30rem}}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:400;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Regular.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:500;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Medium.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBSkeleton;font-style:normal;font-weight:600;src:url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNB-Skeleton-Bold.ttf) format("truetype")}@font-face{font-display:fallback;font-family:DNBMonoSkeleton;font-style:normal;font-weight:400;src:url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.woff2) format("woff2"),url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.woff) format("woff"),url(../../assets/fonts/dnb/skeleton/DNBMono-Skeleton-Regular.ttf) format("truetype")}

package/cjs/components/skeleton/style/dnb-skeleton.scss CHANGED Viewed

@@ -87,6 +87,7 @@
       --font-family-monospace: 'DNBMonoSkeleton' !important;
       font-family: var(--font-family-monospace) !important;
       font-style: unset !important;
+      box-shadow: none !important;
     }
   }

package/cjs/components/slider/SliderInstance.js CHANGED Viewed

@@ -59,6 +59,7 @@ function SliderInstance() {
   const addButton = showButtons ? _AddButton || (_AddButton = _react.default.createElement(AddButton, null)) : null;
   (0, _SkeletonHelper.skeletonDOMAttributes)(mainParams, skeleton, context);
   return _react.default.createElement("span", mainParams, label && _react.default.createElement(_FormLabel.default, {
+    forId: `${id}-thumb-0`,
     id: id + '-label',
     text: label,
     disabled: disabled,

package/cjs/components/slider/SliderInstance.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderInstance.js","names":["_react","_interopRequireDefault","require","_classnames","_componentHelper","_AlignmentHelper2","_SpacingHelper","_SkeletonHelper","_Context","_Suffix","_Button","_FormLabel","_FormStatus","_SliderTrack","_SliderThumb2","_useSliderProps","_SliderHelpers","_excluded","_SubtractButton","_AddButton","_AlignmentHelper","_SliderThumb","_SliderTrackBefore","_SliderTrackAfter","_SliderSuffix","obj","__esModule","default","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","key","i","Object","getOwnPropertySymbols","sourceSymbolKeys","length","indexOf","prototype","propertyIsEnumerable","call","sourceKeys","keys","_extends","assign","bind","arguments","hasOwnProperty","apply","SliderInstance","context","React","useContext","Context","isReverse","isVertical","showButtons","showStatus","shouldAnimate","allProps","useSliderProps","id","label","labelSrOnly","labelDirection","status","statusProps","statusState","statusNoAnimation","globalStatus","stretch","skeleton","disabled","className","extensions","mainParams","classnames","createSkeletonClass","createSpacingClasses","isTrue","subtractButton","createElement","SubtractButton","addButton","AddButton","skeletonDOMAttributes","text","srOnly","show","text_id","state","no_animation","SliderMainTrack","entries","map","_ref2","_ref","instance","options","Element","SliderThumb","SliderTrackBefore","SliderTrackAfter","SliderSuffix","suffix","emitChange","value","attributes","step","min","max","subtractTitle","numberFormat","onSubtractClickHandler","event","clamp","subtractParams","humanNumber","getFormattedNumber","variant","icon","size","replace","aria","String","on_click","addTitle","onAddClickHandler","addParams"],"sources":["../../../../src/components/slider/SliderInstance.tsx"],"sourcesContent":["/*\n Web Slider Component\n \n /\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { isTrue } from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n createSkeletonClass,\n skeletonDOMAttributes,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport Button from '../button/Button'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\nimport {\n SliderMainTrack,\n SliderTrackBefore,\n SliderTrackAfter,\n} from './SliderTrack'\nimport { SliderThumb } from './SliderThumb'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderInstance() {\n const context = React.useContext(Context)\n\n const {\n isReverse,\n isVertical,\n showButtons,\n showStatus,\n shouldAnimate,\n allProps,\n } = useSliderProps()\n\n const {\n id,\n label,\n labelSrOnly,\n labelDirection,\n status,\n statusProps,\n statusState,\n statusNoAnimation,\n globalStatus,\n stretch,\n skeleton,\n disabled,\n className,\n extensions,\n } = allProps\n\n const mainParams = {\n className: classnames(\n 'dnb-slider',\n isVertical && 'dnb-slider--vertical',\n disabled && 'dnb-slider__state--disabled',\n shouldAnimate && 'dnb-slider__state--animate',\n !showButtons && 'dnb-slider--no-buttons',\n isTrue(stretch) && 'dnb-slider--stretch',\n label && labelDirection && `dnb-slider__label--${labelDirection}`,\n showStatus && 'dnb-slider__form-status',\n status && `dnb-slider__status--${statusState}`,\n 'dnb-form-component',\n createSkeletonClass(null, skeleton),\n createSpacingClasses(allProps),\n className\n ),\n }\n\n const subtractButton = showButtons ? <SubtractButton /> : null\n const addButton = showButtons ? <AddButton /> : null\n\n skeletonDOMAttributes(mainParams, skeleton, context)\n\n return (\n <span {...mainParams}>\n {label && (\n // do not use \"for_id\" as the ID element is not a fo\n <FormLabel\n id={id + '-label'}\n text={label}\n disabled={disabled}\n skeleton={skeleton}\n labelDirection={labelDirection}\n srOnly={labelSrOnly}\n />\n )}\n\n <span className=\"dnb-slider__wrapper\">\n <AlignmentHelper />\n\n <FormStatus\n show={showStatus}\n id={id + '-form-status'}\n globalStatus={globalStatus}\n text_id={id + '-status'} // used for \"aria-describedby\"\n text={status}\n state={statusState}\n no_animation={statusNoAnimation}\n skeleton={skeleton}\n {...statusProps}\n />\n\n <span className=\"dnb-slider__inner\">\n {showButtons && (isReverse ? addButton : subtractButton)}\n\n <SliderMainTrack>\n {extensions &&\n Object.entries(extensions).map(\n ([key, { instance, ...options }]) => {\n const Element = instance as React.ElementType\n return <Element key={key} {...options} />\n }\n )}\n <SliderThumb />\n <SliderTrackBefore />\n <SliderTrackAfter />\n </SliderMainTrack>\n\n {showButtons && (isReverse ? subtractButton : addButton)}\n\n <SliderSuffix />\n </span>\n </span>\n </span>\n )\n}\n\nfunction SliderSuffix() {\n const { allProps } = useSliderProps()\n const { id, suffix } = allProps\n\n return suffix ? (\n <Suffix\n className=\"dnb-slider__suffix\"\n id={id + '-suffix'} // used for \"aria-describedby\"\n context={allProps}\n >\n {suffix}\n </Suffix>\n ) : null\n}\n\nfunction SubtractButton() {\n const { emitChange, value, attributes, allProps } = useSliderProps()\n const {\n step,\n min,\n max,\n disabled,\n skeleton,\n subtractTitle,\n numberFormat,\n } = allProps\n\n const onSubtractClickHandler = (event: MouseEvent \| TouchEvent) => {\n emitChange(event, clamp((value as number) - (step \|\| 1), min, max))\n }\n\n const subtractParams = {}\n\n if (typeof attributes['aria-hidden'] !== 'undefined') {\n subtractParams['aria-hidden'] = attributes['aria-hidden']\n }\n\n const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n return (\n <Button\n className=\"dnb-slider__button dnb-slider__button--subtract\"\n variant=\"secondary\"\n icon=\"subtract\"\n size=\"small\"\n aria-label={subtractTitle?.replace(\n '%s',\n humanNumber.aria \|\| String(value)\n )}\n on_click={onSubtractClickHandler}\n disabled={disabled}\n skeleton={skeleton}\n {...subtractParams}\n />\n )\n}\n\nfunction AddButton() {\n const { emitChange, value, attributes, allProps } = useSliderProps()\n const { step, min, max, disabled, skeleton, addTitle, numberFormat } =\n allProps\n\n const onAddClickHandler = (event: MouseEvent \| TouchEvent) => {\n emitChange(event, clamp((value as number) + (step \|\| 1), min, max))\n }\n\n const addParams = {}\n\n if (typeof attributes['aria-hidden'] !== 'undefined') {\n addParams['aria-hidden'] = attributes['aria-hidden']\n }\n\n const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n return (\n <Button\n className=\"dnb-slider__button dnb-slider__button--add\"\n variant=\"secondary\"\n icon=\"add\"\n size=\"small\"\n aria-label={addTitle?.replace(\n '%s',\n humanNumber.aria \|\| String(value)\n )}\n on_click={onAddClickHandler}\n disabled={disabled}\n skeleton={skeleton}\n {...addParams}\n />\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"SliderInstance.js","names":["_react","_interopRequireDefault","require","_classnames","_componentHelper","_AlignmentHelper2","_SpacingHelper","_SkeletonHelper","_Context","_Suffix","_Button","_FormLabel","_FormStatus","_SliderTrack","_SliderThumb2","_useSliderProps","_SliderHelpers","_excluded","_SubtractButton","_AddButton","_AlignmentHelper","_SliderThumb","_SliderTrackBefore","_SliderTrackAfter","_SliderSuffix","obj","__esModule","default","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","key","i","Object","getOwnPropertySymbols","sourceSymbolKeys","length","indexOf","prototype","propertyIsEnumerable","call","sourceKeys","keys","_extends","assign","bind","arguments","hasOwnProperty","apply","SliderInstance","context","React","useContext","Context","isReverse","isVertical","showButtons","showStatus","shouldAnimate","allProps","useSliderProps","id","label","labelSrOnly","labelDirection","status","statusProps","statusState","statusNoAnimation","globalStatus","stretch","skeleton","disabled","className","extensions","mainParams","classnames","createSkeletonClass","createSpacingClasses","isTrue","subtractButton","createElement","SubtractButton","addButton","AddButton","skeletonDOMAttributes","forId","text","srOnly","show","text_id","state","no_animation","SliderMainTrack","entries","map","_ref2","_ref","instance","options","Element","SliderThumb","SliderTrackBefore","SliderTrackAfter","SliderSuffix","suffix","emitChange","value","attributes","step","min","max","subtractTitle","numberFormat","onSubtractClickHandler","event","clamp","subtractParams","humanNumber","getFormattedNumber","variant","icon","size","replace","aria","String","on_click","addTitle","onAddClickHandler","addParams"],"sources":["../../../../src/components/slider/SliderInstance.tsx"],"sourcesContent":["/*\n Web Slider Component\n \n /\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { isTrue } from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n createSkeletonClass,\n skeletonDOMAttributes,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport Button from '../button/Button'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\nimport {\n SliderMainTrack,\n SliderTrackBefore,\n SliderTrackAfter,\n} from './SliderTrack'\nimport { SliderThumb } from './SliderThumb'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderInstance() {\n const context = React.useContext(Context)\n\n const {\n isReverse,\n isVertical,\n showButtons,\n showStatus,\n shouldAnimate,\n allProps,\n } = useSliderProps()\n\n const {\n id,\n label,\n labelSrOnly,\n labelDirection,\n status,\n statusProps,\n statusState,\n statusNoAnimation,\n globalStatus,\n stretch,\n skeleton,\n disabled,\n className,\n extensions,\n } = allProps\n\n const mainParams = {\n className: classnames(\n 'dnb-slider',\n isVertical && 'dnb-slider--vertical',\n disabled && 'dnb-slider__state--disabled',\n shouldAnimate && 'dnb-slider__state--animate',\n !showButtons && 'dnb-slider--no-buttons',\n isTrue(stretch) && 'dnb-slider--stretch',\n label && labelDirection && `dnb-slider__label--${labelDirection}`,\n showStatus && 'dnb-slider__form-status',\n status && `dnb-slider__status--${statusState}`,\n 'dnb-form-component',\n createSkeletonClass(null, skeleton),\n createSpacingClasses(allProps),\n className\n ),\n }\n\n const subtractButton = showButtons ? <SubtractButton /> : null\n const addButton = showButtons ? <AddButton /> : null\n\n skeletonDOMAttributes(mainParams, skeleton, context)\n\n return (\n <span {...mainParams}>\n {label && (\n <FormLabel\n forId={`${id}-thumb-0`}\n id={id + '-label'}\n text={label}\n disabled={disabled}\n skeleton={skeleton}\n labelDirection={labelDirection}\n srOnly={labelSrOnly}\n />\n )}\n\n <span className=\"dnb-slider__wrapper\">\n <AlignmentHelper />\n\n <FormStatus\n show={showStatus}\n id={id + '-form-status'}\n globalStatus={globalStatus}\n text_id={id + '-status'} // used for \"aria-describedby\"\n text={status}\n state={statusState}\n no_animation={statusNoAnimation}\n skeleton={skeleton}\n {...statusProps}\n />\n\n <span className=\"dnb-slider__inner\">\n {showButtons && (isReverse ? addButton : subtractButton)}\n\n <SliderMainTrack>\n {extensions &&\n Object.entries(extensions).map(\n ([key, { instance, ...options }]) => {\n const Element = instance as React.ElementType\n return <Element key={key} {...options} />\n }\n )}\n <SliderThumb />\n <SliderTrackBefore />\n <SliderTrackAfter />\n </SliderMainTrack>\n\n {showButtons && (isReverse ? subtractButton : addButton)}\n\n <SliderSuffix />\n </span>\n </span>\n </span>\n )\n}\n\nfunction SliderSuffix() {\n const { allProps } = useSliderProps()\n const { id, suffix } = allProps\n\n return suffix ? (\n <Suffix\n className=\"dnb-slider__suffix\"\n id={id + '-suffix'} // used for \"aria-describedby\"\n context={allProps}\n >\n {suffix}\n </Suffix>\n ) : null\n}\n\nfunction SubtractButton() {\n const { emitChange, value, attributes, allProps } = useSliderProps()\n const {\n step,\n min,\n max,\n disabled,\n skeleton,\n subtractTitle,\n numberFormat,\n } = allProps\n\n const onSubtractClickHandler = (event: MouseEvent \| TouchEvent) => {\n emitChange(event, clamp((value as number) - (step \|\| 1), min, max))\n }\n\n const subtractParams = {}\n\n if (typeof attributes['aria-hidden'] !== 'undefined') {\n subtractParams['aria-hidden'] = attributes['aria-hidden']\n }\n\n const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n return (\n <Button\n className=\"dnb-slider__button dnb-slider__button--subtract\"\n variant=\"secondary\"\n icon=\"subtract\"\n size=\"small\"\n aria-label={subtractTitle?.replace(\n '%s',\n humanNumber.aria \|\| String(value)\n )}\n on_click={onSubtractClickHandler}\n disabled={disabled}\n skeleton={skeleton}\n {...subtractParams}\n />\n )\n}\n\nfunction AddButton() {\n const { emitChange, value, attributes, allProps } = useSliderProps()\n const { step, min, max, disabled, skeleton, addTitle, numberFormat } =\n allProps\n\n const onAddClickHandler = (event: MouseEvent \| TouchEvent) => {\n emitChange(event, clamp((value as number) + (step \|\| 1), min, max))\n }\n\n const addParams = {}\n\n if (typeof attributes['aria-hidden'] !== 'undefined') {\n addParams['aria-hidden'] = attributes['aria-hidden']\n }\n\n const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n return (\n <Button\n className=\"dnb-slider__button dnb-slider__button--add\"\n variant=\"secondary\"\n icon=\"add\"\n size=\"small\"\n aria-label={addTitle?.replace(\n '%s',\n humanNumber.aria \|\| String(value)\n )}\n on_click={onAddClickHandler}\n disabled={disabled}\n skeleton={skeleton}\n {...addParams}\n />\n )\n}\n"],"mappings":"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"}

package/cjs/components/slider/SliderThumb.js CHANGED Viewed

@@ -109,10 +109,11 @@ function Thumb(_ref) {
   }
   (0, _componentHelper.validateDOMAttributes)(allProps, thumbParams);
   const elemRef = _react.default.useRef();
-  return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("span", {
+  return _react.default.createElement("span", {
     className: "dnb-slider__thumb",
     style: style
   }, _react.default.createElement("input", _extends({
+    id: `${id}-thumb-${currentIndex}`,
     type: "range",
     className: "dnb-slider__button-helper",
     min: min,
@@ -131,6 +132,7 @@ function Thumb(_ref) {
     "aria-orientation": isVertical ? 'vertical' : 'horizontal',
     "data-index": currentIndex
   }, helperParams)), _react.default.createElement(_Button.default, _extends({
+    id: `${id}-button-${currentIndex}`,
     element: "span",
     type: "",
     variant: "secondary",
@@ -143,6 +145,6 @@ function Thumb(_ref) {
     active: Boolean(showTooltip || alwaysShowTooltip),
     showDelay: 1,
     hideDelay: 300
-  }, number || value, shouldAnimate)));
+  }, number || value, shouldAnimate));
 }
 //# sourceMappingURL=SliderThumb.js.map

package/cjs/components/slider/SliderThumb.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderThumb.js","names":["_react","_interopRequireDefault","require","_componentHelper","_Button","_Tooltip","_useSliderEvents","_useSliderProps","_SliderHelpers","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","SliderThumb","values","useSliderProps","createElement","Fragment","map","value","Thumb","currentIndex","_ref","thumbIndex","isVertical","isReverse","showStatus","attributes","allProps","shouldAnimate","id","label","min","max","step","skeleton","disabled","suffix","numberFormat","tooltip","alwaysShowTooltip","index","current","percent","clamp","style","zIndex","number","aria","getFormattedNumber","showTooltip","setShowTooltip","React","useState","onMouseEnterHandler","onMouseLeaveHandler","elemRef","dispatchEvent","Event","e","warn","onThumbMouseDownHandler","onThumbMouseUpHandler","onHelperChangeHandler","onHelperFocusHandler","useSliderEvents","helperParams","combineLabelledBy","combineDescribedBy","thumbParams","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","onBlur","onFocus","event","validateDOMAttributes","useRef","className","type","onChange","onMouseDown","onMouseUp","undefined","element","variant","innerRef","targetElement","active","Boolean","showDelay","hideDelay"],"sources":["../../../../src/components/slider/SliderThumb.tsx"],"sourcesContent":["import React from 'react'\nimport {\n combineDescribedBy,\n combineLabelledBy,\n validateDOMAttributes,\n warn,\n} from '../../shared/component-helper'\nimport Button from '../button/Button'\nimport Tooltip from '../tooltip/Tooltip'\nimport { useSliderEvents } from './hooks/useSliderEvents'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderThumb() {\n const { values } = useSliderProps()\n\n return (\n <>\n {values.map((value, i) => {\n return <Thumb key={i} value={value} currentIndex={i} />\n })}\n </>\n )\n}\n\ntype ThumbProps = {\n value: number\n currentIndex: number\n}\n\nfunction Thumb({ value, currentIndex }: ThumbProps) {\n const {\n thumbIndex,\n isVertical,\n isReverse,\n showStatus,\n attributes,\n allProps,\n shouldAnimate,\n } = useSliderProps()\n\n const {\n id,\n label,\n min,\n max,\n step,\n skeleton,\n disabled,\n suffix,\n numberFormat,\n tooltip,\n alwaysShowTooltip,\n } = allProps\n\n const index = thumbIndex.current\n let percent = clamp(((value - min) * 100) / (max - min))\n\n if (isReverse) {\n percent = 100 - percent\n }\n\n const style = {\n zIndex: index === currentIndex ? 4 : 3,\n [`${isVertical ? 'top' : 'left'}`]: `${percent}%`,\n } as React.CSSProperties\n\n const { number, aria } = getFormattedNumber(value, numberFormat)\n\n const [showTooltip, setShowTooltip] = React.useState(false)\n const onMouseEnterHandler = () => {\n setShowTooltip(true)\n }\n const onMouseLeaveHandler = () => {\n setShowTooltip(false)\n try {\n elemRef.current.dispatchEvent(new Event('mouseleave'))\n } catch (e) {\n warn(e)\n }\n }\n\n const {\n onThumbMouseDownHandler,\n onThumbMouseUpHandler,\n onHelperChangeHandler,\n onHelperFocusHandler,\n } = useSliderEvents()\n\n const helperParams: Record<string, unknown> = {}\n\n if (label) {\n helperParams['aria-labelledby'] = combineLabelledBy(\n helperParams,\n label ? id + '-label' : null\n )\n }\n\n if (showStatus \|\| suffix) {\n helperParams['aria-describedby'] = combineDescribedBy(\n helperParams,\n showStatus ? id + '-status' : null,\n suffix ? id + '-suffix' : null\n )\n }\n\n const thumbParams = attributes as Record<string, unknown>\n\n if (tooltip) {\n thumbParams.onMouseEnter = onMouseEnterHandler\n thumbParams.onMouseLeave = onMouseLeaveHandler\n thumbParams.onTouchStart = onMouseEnterHandler\n thumbParams.onTouchEnd = onMouseLeaveHandler\n helperParams.onBlur = onMouseLeaveHandler\n helperParams.onFocus = (event) => {\n onHelperFocusHandler(event)\n onMouseEnterHandler()\n try {\n elemRef.current.dispatchEvent(new Event('mouseenter'))\n } catch (e) {\n warn(e)\n }\n }\n }\n validateDOMAttributes(allProps, thumbParams) // because we send along rest attributes\n\n const elemRef = React.useRef<HTMLElement>()\n\n return (\n <>\n <span className=\"dnb-slider__thumb\" style={style}>\n <input\n type=\"range\"\n className=\"dnb-slider__button-helper\"\n min={min}\n max={max}\n step={step}\n value={value}\n disabled={disabled}\n onChange={onHelperChangeHandler}\n onFocus={onHelperFocusHandler}\n onMouseDown={onThumbMouseDownHandler}\n onMouseUp={onThumbMouseUpHandler}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-valuetext={aria ? aria : undefined}\n aria-orientation={isVertical ? 'vertical' : 'horizontal'}\n data-index={currentIndex}\n {...helperParams}\n />\n\n <Button\n element=\"span\"\n type=\"\" // avoid getting type=\"button\"\n variant=\"secondary\"\n disabled={disabled}\n skeleton={skeleton}\n innerRef={elemRef}\n {...thumbParams}\n />\n\n {tooltip && (\n <Tooltip\n key={`group-${currentIndex}`}\n targetElement={elemRef}\n active={Boolean(showTooltip \|\| alwaysShowTooltip)}\n showDelay={1}\n hideDelay={300}\n >\n {number \|\| value}\n {\n shouldAnimate /* Use \"shouldAnimate\" only in order to update the position after the thumb animation */\n }\n </Tooltip>\n )}\n </span>\n </>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"SliderThumb.js","names":["_react","_interopRequireDefault","require","_componentHelper","_Button","_Tooltip","_useSliderEvents","_useSliderProps","_SliderHelpers","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","SliderThumb","values","useSliderProps","createElement","Fragment","map","value","Thumb","currentIndex","_ref","thumbIndex","isVertical","isReverse","showStatus","attributes","allProps","shouldAnimate","id","label","min","max","step","skeleton","disabled","suffix","numberFormat","tooltip","alwaysShowTooltip","index","current","percent","clamp","style","zIndex","number","aria","getFormattedNumber","showTooltip","setShowTooltip","React","useState","onMouseEnterHandler","onMouseLeaveHandler","elemRef","dispatchEvent","Event","e","warn","onThumbMouseDownHandler","onThumbMouseUpHandler","onHelperChangeHandler","onHelperFocusHandler","useSliderEvents","helperParams","combineLabelledBy","combineDescribedBy","thumbParams","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","onBlur","onFocus","event","validateDOMAttributes","useRef","className","type","onChange","onMouseDown","onMouseUp","undefined","element","variant","innerRef","targetElement","active","Boolean","showDelay","hideDelay"],"sources":["../../../../src/components/slider/SliderThumb.tsx"],"sourcesContent":["import React from 'react'\nimport {\n combineDescribedBy,\n combineLabelledBy,\n validateDOMAttributes,\n warn,\n} from '../../shared/component-helper'\nimport Button from '../button/Button'\nimport Tooltip from '../tooltip/Tooltip'\nimport { useSliderEvents } from './hooks/useSliderEvents'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderThumb() {\n const { values } = useSliderProps()\n\n return (\n <>\n {values.map((value, i) => {\n return <Thumb key={i} value={value} currentIndex={i} />\n })}\n </>\n )\n}\n\ntype ThumbProps = {\n value: number\n currentIndex: number\n}\n\nfunction Thumb({ value, currentIndex }: ThumbProps) {\n const {\n thumbIndex,\n isVertical,\n isReverse,\n showStatus,\n attributes,\n allProps,\n shouldAnimate,\n } = useSliderProps()\n\n const {\n id,\n label,\n min,\n max,\n step,\n skeleton,\n disabled,\n suffix,\n numberFormat,\n tooltip,\n alwaysShowTooltip,\n } = allProps\n\n const index = thumbIndex.current\n let percent = clamp(((value - min) * 100) / (max - min))\n\n if (isReverse) {\n percent = 100 - percent\n }\n\n const style = {\n zIndex: index === currentIndex ? 4 : 3,\n [`${isVertical ? 'top' : 'left'}`]: `${percent}%`,\n } as React.CSSProperties\n\n const { number, aria } = getFormattedNumber(value, numberFormat)\n\n const [showTooltip, setShowTooltip] = React.useState(false)\n const onMouseEnterHandler = () => {\n setShowTooltip(true)\n }\n const onMouseLeaveHandler = () => {\n setShowTooltip(false)\n try {\n elemRef.current.dispatchEvent(new Event('mouseleave'))\n } catch (e) {\n warn(e)\n }\n }\n\n const {\n onThumbMouseDownHandler,\n onThumbMouseUpHandler,\n onHelperChangeHandler,\n onHelperFocusHandler,\n } = useSliderEvents()\n\n const helperParams: Record<string, unknown> = {}\n\n if (label) {\n helperParams['aria-labelledby'] = combineLabelledBy(\n helperParams,\n label ? id + '-label' : null\n )\n }\n\n if (showStatus \|\| suffix) {\n helperParams['aria-describedby'] = combineDescribedBy(\n helperParams,\n showStatus ? id + '-status' : null,\n suffix ? id + '-suffix' : null\n )\n }\n\n const thumbParams = attributes as Record<string, unknown>\n\n if (tooltip) {\n thumbParams.onMouseEnter = onMouseEnterHandler\n thumbParams.onMouseLeave = onMouseLeaveHandler\n thumbParams.onTouchStart = onMouseEnterHandler\n thumbParams.onTouchEnd = onMouseLeaveHandler\n helperParams.onBlur = onMouseLeaveHandler\n helperParams.onFocus = (event) => {\n onHelperFocusHandler(event)\n onMouseEnterHandler()\n try {\n elemRef.current.dispatchEvent(new Event('mouseenter'))\n } catch (e) {\n warn(e)\n }\n }\n }\n validateDOMAttributes(allProps, thumbParams) // because we send along rest attributes\n\n const elemRef = React.useRef<HTMLElement>()\n\n return (\n <span className=\"dnb-slider__thumb\" style={style}>\n <input\n id={`${id}-thumb-${currentIndex}`}\n type=\"range\"\n className=\"dnb-slider__button-helper\"\n min={min}\n max={max}\n step={step}\n value={value}\n disabled={disabled}\n onChange={onHelperChangeHandler}\n onFocus={onHelperFocusHandler}\n onMouseDown={onThumbMouseDownHandler}\n onMouseUp={onThumbMouseUpHandler}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-valuetext={aria ? aria : undefined}\n aria-orientation={isVertical ? 'vertical' : 'horizontal'}\n data-index={currentIndex}\n {...helperParams}\n />\n\n <Button\n id={`${id}-button-${currentIndex}`}\n element=\"span\"\n type=\"\" // avoid getting type=\"button\"\n variant=\"secondary\"\n disabled={disabled}\n skeleton={skeleton}\n innerRef={elemRef}\n {...thumbParams}\n />\n\n {tooltip && (\n <Tooltip\n key={`group-${currentIndex}`}\n targetElement={elemRef}\n active={Boolean(showTooltip \|\| alwaysShowTooltip)}\n showDelay={1}\n hideDelay={300}\n >\n {number \|\| value}\n {\n shouldAnimate /* Use \"shouldAnimate\" only in order to update the position after the thumb animation */\n }\n </Tooltip>\n )}\n </span>\n )\n}\n"],"mappings":"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"}

package/cjs/components/step-indicator/StepIndicator.js CHANGED Viewed

@@ -1,18 +1,22 @@
 "use strict";
+"use client";
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _componentHelper = require("../../shared/component-helper");
 var _StepIndicatorSidebar = _interopRequireDefault(require("./StepIndicatorSidebar"));
 var _StepIndicatorModal = _interopRequireDefault(require("./StepIndicatorModal"));
 var _StepIndicatorContext = require("./StepIndicatorContext");
 var _StepIndicatorProps = require("./StepIndicatorProps");
+var _useId = _interopRequireDefault(require("../../shared/helpers/useId"));
 var _div;
 const _excluded = ["data", "skeleton", "current_step", "hide_numbers", "no_animation"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -37,10 +41,12 @@ function StepIndicator(_ref) {
     hide_numbers,
     no_animation
   }, restOfProps);
-  const sidebarId = props.sidebar_id || (0, _componentHelper.makeUniqueId)();
-  if (!props.sidebar_id && props.mode) {
-    (0, _componentHelper.warn)('StepIndicator needs an unique "sidebar_id" property, also on the <StepIndicator.Sidebar... />');
-  }
+  const sidebarId = (0, _useId.default)(props.sidebar_id);
+  (0, _react.useEffect)(() => {
+    if (!props.sidebar_id && props.mode) {
+      (0, _componentHelper.warn)('StepIndicator needs an unique "sidebar_id" property, also on the <StepIndicator.Sidebar... />');
+    }
+  }, [props.mode, props.sidebar_id]);
   return _react.default.createElement(_StepIndicatorContext.StepIndicatorProvider, _extends({}, props, {
     sidebar_id: sidebarId
   }), _div || (_div = _react.default.createElement("div", {

package/cjs/components/step-indicator/StepIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepIndicator.js","names":["_react","_interopRequireDefault","require","_componentHelper","_StepIndicatorSidebar","_StepIndicatorModal","_StepIndicatorContext","_StepIndicatorProps","_div","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","_objectSpread","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","StepIndicator","_ref","data","stepIndicatorDefaultProps","skeleton","current_step","hide_numbers","no_animation","restOfProps","props","sidebarId","sidebar_id","makeUniqueId","mode","warn","createElement","StepIndicatorProvider","className","Sidebar","StepIndicatorSidebar","_supportsSpacingProps","_default","exports"],"sources":["../../../../src/components/step-indicator/StepIndicator.tsx"],"sourcesContent":["/*\n Web StepIndicator Component\n \n /\n\nimport React from 'react'\n\nimport { makeUniqueId, warn } from '../../shared/component-helper'\nimport StepIndicatorSidebar from './StepIndicatorSidebar'\n\nimport StepIndicatorModal from './StepIndicatorModal'\nimport {\n StepIndicatorContextValues,\n StepIndicatorProvider,\n} from './StepIndicatorContext'\n\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../Skeleton'\nimport type {\n StepIndicatorItemProps,\n StepItemWrapper,\n} from './StepIndicatorItem'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\n\nexport type StepIndicatorMode = 'static' \| 'strict' \| 'loose'\nexport type StepIndicatorDataItem = Pick<\n StepIndicatorItemProps,\n \| 'title'\n \| 'is_current'\n \| 'inactive'\n \| 'disabled'\n \| 'status'\n \| 'status_state'\n \| 'on_click'\n \| 'on_render'\n>\nexport type StepIndicatorData = string \| string[] \| StepIndicatorDataItem[]\n\nexport type StepIndicatorMouseEvent = {\n event: React.MouseEvent<HTMLButtonElement>\n item: StepIndicatorItemProps\n currentStep: number\n current_step: number\n}\n\nexport type StepIndicatorRenderCallback = {\n StepItem: typeof StepItemWrapper\n element: React.ReactNode\n attributes: React.HTMLProps<HTMLElement>\n props: StepIndicatorItemProps\n context: StepIndicatorContextValues\n}\n\nexport type StepIndicatorProps = Omit<\n React.HTMLProps<HTMLAnchorElement>,\n 'ref' \| 'data'\n> &\n SpacingProps & {\n /*\n <em>(required with `<StepIndicator.Sidebar />`)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n /\n sidebar_id?: string\n /\n <em>(required)</em> defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n /\n mode: StepIndicatorMode\n /\n <em>(required)</em> defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n /\n data: StepIndicatorData\n /\n The title shown inside the `<StepIndicatorModal />` supplemental screen reader text for the `<StepIndicatorTriggerButton />`\n * Defaults to `Steps Overview`\n /\n overview_title?: string\n /\n The label for `<StepIndicatorTriggerButton />` and supplemental screen reader text for `<StepIndicatorItem />`\n * This value need to contain `%step` and `%count` if you want to display the current step and total amount of steps\n * `%step` is used to place the current step into the text\n * `%count` is used to place the step total into the text\n * Defaults to `Step %step of %count`\n /\n step_title?: string\n /\n A descriptive label used in `<StepIndicatorModal />`\n * This value need to contain `%step` and `%count` if you want to display the current step and total amount of steps\n * `%step` is used to place the current step into the text\n * `%count` is used to place the step total into the text\n * Defaults to `You are on step %step of %count`\n /\n step_title_extended?: string\n /\n Defines the active number marked step starting by 0. Defaults to `0`.\n /\n current_step?: number\n /\n Define whether to show automatically counted numbers or not. Defaults to `false`.\n /\n hide_numbers?: boolean\n /\n Will be called once the user clicks on the current or another step. Will be emitted on every click. Returns an object `{ event, item, current_step, currentStep }`.\n /\n on_click?: ({\n event,\n item,\n current_step,\n currentStep,\n }: StepIndicatorMouseEvent) => void\n /\n Callback function to manipulate or wrap every item. Has to return a React Node. You receive an object you can use in your custom HOC `{ StepItem, element, attributes, props, context }`.\n /\n on_item_render?: ({\n StepItem,\n element,\n attributes,\n props,\n context,\n }: StepIndicatorRenderCallback) => React.ReactNode\n /\n Will be called once the user visits actively a new step. Will be emitted only once. Returns an object `{ event, item, current_step, currentStep }`.\n /\n on_change?: ({\n event,\n item,\n current_step,\n currentStep,\n }: StepIndicatorMouseEvent) => void\n\n /\n If set to `true`, the height animation on the step items and the drawer button will be omitted. Defaults to `false`.\n */\n no_animation?: boolean\n skeleton?: SkeletonShow\n className?: string\n children?: React.ReactNode\n }\n\nfunction StepIndicator({\n data = stepIndicatorDefaultProps.data,\n skeleton = stepIndicatorDefaultProps.skeleton,\n current_step = stepIndicatorDefaultProps.current_step,\n hide_numbers = stepIndicatorDefaultProps.hide_numbers,\n no_animation = stepIndicatorDefaultProps.no_animation,\n ...restOfProps\n}: StepIndicatorProps) {\n const props = {\n data,\n skeleton,\n current_step,\n hide_numbers,\n no_animation,\n ...restOfProps,\n }\n\n const sidebarId = props.sidebar_id \|\| makeUniqueId()\n\n if (!props.sidebar_id && props.mode) {\n warn(\n 'StepIndicator needs an unique \"sidebar_id\" property, also on the <StepIndicator.Sidebar... />'\n )\n }\n\n return (\n <StepIndicatorProvider {...props} sidebar_id={sidebarId}>\n <div className=\"dnb-step-indicator-wrapper\">\n <StepIndicatorModal />\n </div>\n </StepIndicatorProvider>\n )\n}\n\nStepIndicator.Sidebar = StepIndicatorSidebar\n\nStepIndicator._supportsSpacingProps = true\n\nexport default StepIndicator\n"],"mappings":"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"}
1	+ {"version":3,"file":"StepIndicator.js","names":["_react","_interopRequireWildcard","require","_componentHelper","_StepIndicatorSidebar","_interopRequireDefault","_StepIndicatorModal","_StepIndicatorContext","_StepIndicatorProps","_useId","_div","_excluded","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","enumerable","push","_objectSpread","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","StepIndicator","_ref","data","stepIndicatorDefaultProps","skeleton","current_step","hide_numbers","no_animation","restOfProps","props","sidebarId","useId","sidebar_id","useEffect","mode","warn","createElement","StepIndicatorProvider","className","Sidebar","StepIndicatorSidebar","_supportsSpacingProps","_default","exports"],"sources":["../../../../src/components/step-indicator/StepIndicator.tsx"],"sourcesContent":["/*\n Web StepIndicator Component\n \n /\n\nimport React, { useEffect } from 'react'\n\nimport { warn } from '../../shared/component-helper'\nimport StepIndicatorSidebar from './StepIndicatorSidebar'\n\nimport StepIndicatorModal from './StepIndicatorModal'\nimport {\n StepIndicatorContextValues,\n StepIndicatorProvider,\n} from './StepIndicatorContext'\n\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../Skeleton'\nimport type {\n StepIndicatorItemProps,\n StepItemWrapper,\n} from './StepIndicatorItem'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport useId from '../../shared/helpers/useId'\n\nexport type StepIndicatorMode = 'static' \| 'strict' \| 'loose'\nexport type StepIndicatorDataItem = Pick<\n StepIndicatorItemProps,\n \| 'title'\n \| 'is_current'\n \| 'inactive'\n \| 'disabled'\n \| 'status'\n \| 'status_state'\n \| 'on_click'\n \| 'on_render'\n>\nexport type StepIndicatorData = string \| string[] \| StepIndicatorDataItem[]\n\nexport type StepIndicatorMouseEvent = {\n event: React.MouseEvent<HTMLButtonElement>\n item: StepIndicatorItemProps\n currentStep: number\n current_step: number\n}\n\nexport type StepIndicatorRenderCallback = {\n StepItem: typeof StepItemWrapper\n element: React.ReactNode\n attributes: React.HTMLProps<HTMLElement>\n props: StepIndicatorItemProps\n context: StepIndicatorContextValues\n}\n\nexport type StepIndicatorProps = Omit<\n React.HTMLProps<HTMLAnchorElement>,\n 'ref' \| 'data'\n> &\n SpacingProps & {\n /*\n <em>(required with `<StepIndicator.Sidebar />`)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n /\n sidebar_id?: string\n /\n <em>(required)</em> defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n /\n mode: StepIndicatorMode\n /\n <em>(required)</em> defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n /\n data: StepIndicatorData\n /\n The title shown inside the `<StepIndicatorModal />` supplemental screen reader text for the `<StepIndicatorTriggerButton />`\n * Defaults to `Steps Overview`\n /\n overview_title?: string\n /\n The label for `<StepIndicatorTriggerButton />` and supplemental screen reader text for `<StepIndicatorItem />`\n * This value need to contain `%step` and `%count` if you want to display the current step and total amount of steps\n * `%step` is used to place the current step into the text\n * `%count` is used to place the step total into the text\n * Defaults to `Step %step of %count`\n /\n step_title?: string\n /\n A descriptive label used in `<StepIndicatorModal />`\n * This value need to contain `%step` and `%count` if you want to display the current step and total amount of steps\n * `%step` is used to place the current step into the text\n * `%count` is used to place the step total into the text\n * Defaults to `You are on step %step of %count`\n /\n step_title_extended?: string\n /\n Defines the active number marked step starting by 0. Defaults to `0`.\n /\n current_step?: number\n /\n Define whether to show automatically counted numbers or not. Defaults to `false`.\n /\n hide_numbers?: boolean\n /\n Will be called once the user clicks on the current or another step. Will be emitted on every click. Returns an object `{ event, item, current_step, currentStep }`.\n /\n on_click?: ({\n event,\n item,\n current_step,\n currentStep,\n }: StepIndicatorMouseEvent) => void\n /\n Callback function to manipulate or wrap every item. Has to return a React Node. You receive an object you can use in your custom HOC `{ StepItem, element, attributes, props, context }`.\n /\n on_item_render?: ({\n StepItem,\n element,\n attributes,\n props,\n context,\n }: StepIndicatorRenderCallback) => React.ReactNode\n /\n Will be called once the user visits actively a new step. Will be emitted only once. Returns an object `{ event, item, current_step, currentStep }`.\n /\n on_change?: ({\n event,\n item,\n current_step,\n currentStep,\n }: StepIndicatorMouseEvent) => void\n\n /\n If set to `true`, the height animation on the step items and the drawer button will be omitted. Defaults to `false`.\n */\n no_animation?: boolean\n skeleton?: SkeletonShow\n className?: string\n children?: React.ReactNode\n }\n\nfunction StepIndicator({\n data = stepIndicatorDefaultProps.data,\n skeleton = stepIndicatorDefaultProps.skeleton,\n current_step = stepIndicatorDefaultProps.current_step,\n hide_numbers = stepIndicatorDefaultProps.hide_numbers,\n no_animation = stepIndicatorDefaultProps.no_animation,\n ...restOfProps\n}: StepIndicatorProps) {\n const props = {\n data,\n skeleton,\n current_step,\n hide_numbers,\n no_animation,\n ...restOfProps,\n }\n\n const sidebarId = useId(props.sidebar_id)\n\n useEffect(() => {\n if (!props.sidebar_id && props.mode) {\n warn(\n 'StepIndicator needs an unique \"sidebar_id\" property, also on the <StepIndicator.Sidebar... />'\n )\n }\n }, [props.mode, props.sidebar_id])\n\n return (\n <StepIndicatorProvider {...props} sidebar_id={sidebarId}>\n <div className=\"dnb-step-indicator-wrapper\">\n <StepIndicatorModal />\n </div>\n </StepIndicatorProvider>\n )\n}\n\nStepIndicator.Sidebar = StepIndicatorSidebar\n\nStepIndicator._supportsSpacingProps = true\n\nexport default StepIndicator\n"],"mappings":"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"}

package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.css CHANGED Viewed

@@ -55,7 +55,7 @@ html[data-whatinput=keyboard] .dnb-step-indicator-wrapper .dnb-step-indicator__i
 .dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-button__icon {
   align-self: flex-start;
   margin-top: 1rem;
-  margin-right: 0.75rem;
+  margin-right: 0.25rem;
 }
 .dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__number, .dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__status {
   font-weight: var(--font-weight-basis);

package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.min.css CHANGED Viewed

	@@ -1 +1 @@
1	- .dnb-step-indicator-wrapper .dnb-step-indicator__item--current .dnb-button{--border-color:var(--color-sea-green);--border-width:0.125rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);font-weight:var(--font-weight-medium)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--visited .dnb-button{background-color:var(--color-pistachio)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button{cursor:text;pointer-events:auto;-webkit-user-select:initial;user-select:auto}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:active,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:focus,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:hover{--border-color:var(--color-black-20);--border-width:0.0625rem;background-color:var(--color-white);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--color-black-80)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:active,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:focus,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:hover{--border-color:var(--color-black-80);--border-width:0.125rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-step-indicator-wrapper .dnb-step-indicator__item--current .dnb-button:not([disabled]):not(:active):not(:hover):focus{background-color:var(--color-mint-green);color:var(--color-emerald-green)}.dnb-step-indicator-wrapper .dnb-step-indicator__label,.dnb-step-indicator-wrapper .dnb-step-indicator__label.dnb-p{font-size:var(--font-size-small);margin-bottom:.5rem}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status.dnb-button--secondary{background-color:var(--color-sand-yellow)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status--error.dnb-button--secondary{background-color:var(--color-fire-red-8)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status--info.dnb-button--secondary{background-color:var(--color-pistachio)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-button__icon{align-self:flex-start;margin-right:.~~75rem~~;margin-top:1rem}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__number,.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__status{font-weight:var(--font-weight-basis)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__status{color:var(--color-black-80);font-size:var(--font-size-x-small);line-height:var(--font-size-basis);margin-top:.5rem}
1	+ .dnb-step-indicator-wrapper .dnb-step-indicator__item--current .dnb-button{--border-color:var(--color-sea-green);--border-width:0.125rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);font-weight:var(--font-weight-medium)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--visited .dnb-button{background-color:var(--color-pistachio)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button{cursor:text;pointer-events:auto;-webkit-user-select:initial;user-select:auto}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:active,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:focus,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive .dnb-button.dnb-button--secondary:hover{--border-color:var(--color-black-20);--border-width:0.0625rem;background-color:var(--color-white);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--color-black-80)}.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:active,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:focus,.dnb-step-indicator-wrapper .dnb-step-indicator__item--inactive.dnb-step-indicator__item--current .dnb-button.dnb-button--secondary:hover{--border-color:var(--color-black-80);--border-width:0.125rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-step-indicator-wrapper .dnb-step-indicator__item--current .dnb-button:not([disabled]):not(:active):not(:hover):focus{background-color:var(--color-mint-green);color:var(--color-emerald-green)}.dnb-step-indicator-wrapper .dnb-step-indicator__label,.dnb-step-indicator-wrapper .dnb-step-indicator__label.dnb-p{font-size:var(--font-size-small);margin-bottom:.5rem}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status.dnb-button--secondary{background-color:var(--color-sand-yellow)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status--error.dnb-button--secondary{background-color:var(--color-fire-red-8)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status--info.dnb-button--secondary{background-color:var(--color-pistachio)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-button__icon{align-self:flex-start;margin-right:.25rem;margin-top:1rem}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__number,.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__status{font-weight:var(--font-weight-basis)}.dnb-step-indicator-wrapper .dnb-step-indicator__button__status .dnb-step-indicator__item-content__status{color:var(--color-black-80);font-size:var(--font-size-x-small);line-height:var(--font-size-basis);margin-top:.5rem}

package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.scss CHANGED Viewed

@@ -74,7 +74,7 @@
     .dnb-button__icon {
       align-self: flex-start;
       margin-top: 1rem;
-      margin-right: 0.75rem;
+      margin-right: 0.25rem;
     }
     .dnb-step-indicator__item-content {

package/cjs/components/table/TableScrollView.d.ts CHANGED Viewed

@@ -8,4 +8,8 @@ export type TableScrollViewProps = {
     children: React.ReactElement<HTMLTableElement>;
 };
 export type TableScrollViewAllProps = TableScrollViewProps & Omit<React.TableHTMLAttributes<HTMLDivElement>, 'children'> & SpacingProps & ScrollViewAllProps;
-export default function TableScrollView(props: TableScrollViewAllProps): import("react/jsx-runtime").JSX.Element;
+declare function TableScrollView(props: TableScrollViewAllProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TableScrollView {
+    var _supportsSpacingProps: boolean;
+}
+export default TableScrollView;

package/cjs/components/table/TableScrollView.js CHANGED Viewed

@@ -23,4 +23,5 @@ function TableScrollView(props) {
     interactive: "auto"
   }, rest), children);
 }
+TableScrollView._supportsSpacingProps = true;
 //# sourceMappingURL=TableScrollView.js.map

package/cjs/components/table/TableScrollView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableScrollView.js","names":["_react","_interopRequireDefault","require","_classnames","_ScrollView","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","TableScrollView","props","className","children","rest","createElement","classnames","interactive"],"sources":["../../../../src/components/table/TableScrollView.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport ScrollView, {\n ScrollViewAllProps,\n} from '../../fragments/scroll-view/ScrollView'\n\nimport type { SpacingProps } from '../../shared/types'\n\nexport type TableScrollViewProps = {\n /*\n The content of the component.\n */\n children: React.ReactElement<HTMLTableElement>\n}\n\nexport type TableScrollViewAllProps = TableScrollViewProps &\n Omit<React.TableHTMLAttributes<HTMLDivElement>, 'children'> &\n SpacingProps &\n ScrollViewAllProps\n\nexport default function TableScrollView(props: TableScrollViewAllProps) {\n const { className, children, ...rest } = props\n\n return (\n <ScrollView\n className={classnames('dnb-table__scroll-view', className)}\n interactive=\"auto\"\n {...rest}\n >\n {children}\n </ScrollView>\n )\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,WAAA,GAAAH,sBAAA,CAAAC,OAAA;AAE+C,MAAAG,SAAA;AAAA,SAAAJ,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAAA,SAAAQ,yBAAAN,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,GAAAY,6BAAA,CAAAR,MAAA,EAAAO,QAAA,OAAAN,GAAA,EAAAJ,CAAA,MAAAJ,MAAA,CAAAgB,qBAAA,QAAAC,gBAAA,GAAAjB,MAAA,CAAAgB,qBAAA,CAAAT,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAAa,gBAAA,CAAAX,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAS,gBAAA,CAAAb,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,uBAAAR,MAAA,CAAAS,SAAA,CAAAU,oBAAA,CAAAR,IAAA,CAAAJ,MAAA,EAAAC,GAAA,aAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAL,MAAA;AAAA,SAAAY,8BAAAR,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,WAAAiB,UAAA,GAAApB,MAAA,CAAAqB,IAAA,CAAAd,MAAA,OAAAC,GAAA,EAAAJ,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAgB,UAAA,CAAAd,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAY,UAAA,CAAAhB,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,kBAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAL,MAAA;AAgBhC,SAASmB,eAAeA,CAACC,KAA8B,EAAE;EACtE,MAAM;MAAEC,SAAS;MAAEC;IAAkB,CAAC,GAAGF,KAAK;IAAdG,IAAI,GAAAb,wBAAA,CAAKU,KAAK,EAAA5B,SAAA;EAE9C,OACEL,MAAA,CAAAQ,OAAA,CAAA6B,aAAA,CAACjC,WAAA,CAAAI,OAAU,EAAAC,QAAA;IACTyB,SAAS,EAAE,IAAAI,mBAAU,EAAC,wBAAwB,EAAEJ,SAAS,CAAE;IAC3DK,WAAW,EAAC;EAAM,GACdH,IAAI,GAEPD,QACS,CAAC;AAEjB"}
1	+ {"version":3,"file":"TableScrollView.js","names":["_react","_interopRequireDefault","require","_classnames","_ScrollView","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","TableScrollView","props","className","children","rest","createElement","classnames","interactive","_supportsSpacingProps"],"sources":["../../../../src/components/table/TableScrollView.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport ScrollView, {\n ScrollViewAllProps,\n} from '../../fragments/scroll-view/ScrollView'\n\nimport type { SpacingProps } from '../../shared/types'\n\nexport type TableScrollViewProps = {\n /*\n The content of the component.\n */\n children: React.ReactElement<HTMLTableElement>\n}\n\nexport type TableScrollViewAllProps = TableScrollViewProps &\n Omit<React.TableHTMLAttributes<HTMLDivElement>, 'children'> &\n SpacingProps &\n ScrollViewAllProps\n\nexport default function TableScrollView(props: TableScrollViewAllProps) {\n const { className, children, ...rest } = props\n\n return (\n <ScrollView\n className={classnames('dnb-table__scroll-view', className)}\n interactive=\"auto\"\n {...rest}\n >\n {children}\n </ScrollView>\n )\n}\n\nTableScrollView._supportsSpacingProps = true\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,WAAA,GAAAH,sBAAA,CAAAC,OAAA;AAE+C,MAAAG,SAAA;AAAA,SAAAJ,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAAA,SAAAQ,yBAAAN,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,GAAAY,6BAAA,CAAAR,MAAA,EAAAO,QAAA,OAAAN,GAAA,EAAAJ,CAAA,MAAAJ,MAAA,CAAAgB,qBAAA,QAAAC,gBAAA,GAAAjB,MAAA,CAAAgB,qBAAA,CAAAT,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAAa,gBAAA,CAAAX,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAS,gBAAA,CAAAb,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,uBAAAR,MAAA,CAAAS,SAAA,CAAAU,oBAAA,CAAAR,IAAA,CAAAJ,MAAA,EAAAC,GAAA,aAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAL,MAAA;AAAA,SAAAY,8BAAAR,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,WAAAiB,UAAA,GAAApB,MAAA,CAAAqB,IAAA,CAAAd,MAAA,OAAAC,GAAA,EAAAJ,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAgB,UAAA,CAAAd,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAY,UAAA,CAAAhB,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,kBAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAL,MAAA;AAgBhC,SAASmB,eAAeA,CAACC,KAA8B,EAAE;EACtE,MAAM;MAAEC,SAAS;MAAEC;IAAkB,CAAC,GAAGF,KAAK;IAAdG,IAAI,GAAAb,wBAAA,CAAKU,KAAK,EAAA5B,SAAA;EAE9C,OACEL,MAAA,CAAAQ,OAAA,CAAA6B,aAAA,CAACjC,WAAA,CAAAI,OAAU,EAAAC,QAAA;IACTyB,SAAS,EAAE,IAAAI,mBAAU,EAAC,wBAAwB,EAAEJ,SAAS,CAAE;IAC3DK,WAAW,EAAC;EAAM,GACdH,IAAI,GAEPD,QACS,CAAC;AAEjB;AAEAH,eAAe,CAACQ,qBAAqB,GAAG,IAAI"}

package/cjs/components/table/TableTr.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import React from 'react';
-import { TableTdProps } from './TableTd';
 import TableAccordionTr from './TableAccordionTr';
 export type TableTrProps = {
     /**
@@ -47,7 +46,7 @@ export type TableTrProps = {
     /**
      * The content of the component.
      */
-    children: React.ReactElement<TableTdProps> | Array<React.ReactElement<TableTdProps>>;
+    children: React.ReactNode;
 };
 declare function Tr(componentProps: TableTrProps & React.TableHTMLAttributes<HTMLTableRowElement>): import("react/jsx-runtime").JSX.Element;
 declare namespace Tr {

package/cjs/components/table/TableTr.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableTr.js","names":["_react","_interopRequireDefault","require","_classnames","_TableAccordion","_TableContext","_TableAccordionTr","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Tr","componentProps","variant","noWrap","expanded","disabled","noAnimation","onClick","onOpened","onClosed","children","className","_className","props","currentVariant","isLast","useHandleTrVariant","classnames","accordionTr","useTableAccordion","createElement","role","_ref","tableContext","React","useContext","TableContext","countRef","trCountRef","current","increment","count","setCount","useState","window","useEffect","rerenderAlias","useHandleOddEven","_ref2","useRef","setRerenderAlias","isMounted","forceRerender","AccordionContent","TableAccordionTr"],"sources":["../../../../src/components/table/TableTr.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { useTableAccordion } from './TableAccordion'\nimport { TableTdProps } from './TableTd'\nimport { TableContext } from './TableContext'\nimport TableAccordionTr from './TableAccordionTr'\n\nexport type TableTrProps = {\n /*\n The variant of the tr\n /\n variant?: 'even' \| 'odd'\n\n /\n If set to true, the inherited header text will not wrap to new lines\n * Default: false\n /\n noWrap?: boolean\n\n /\n Set true to render the tr initially as expanded\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n expanded?: boolean\n\n /\n Set true to disable the tr to be accessible as an interactive element\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n disabled?: boolean\n\n /\n Set to true to skip animation\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n noAnimation?: boolean\n\n /\n Will emit when user clicks/expands the table row\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onClick?: (event?: React.SyntheticEvent) => void\n\n /\n Will emit when table row is expanded\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onOpened?: (event?: React.SyntheticEvent) => void\n\n /\n Will emit when table row is closed (after it was open)\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onClosed?: (event?: React.SyntheticEvent) => void\n\n /\n The content of the component.\n /\n children:\n \| React.ReactElement<TableTdProps>\n \| Array<React.ReactElement<TableTdProps>>\n}\n\nexport default function Tr(\n componentProps: TableTrProps &\n React.TableHTMLAttributes<HTMLTableRowElement>\n) {\n const {\n variant,\n noWrap,\n expanded,\n disabled,\n noAnimation,\n onClick,\n onOpened,\n onClosed,\n children,\n className: _className,\n ...props\n } = componentProps\n\n const { currentVariant, isLast } = useHandleTrVariant({\n variant,\n })\n\n const className = classnames(\n 'dnb-table__tr',\n currentVariant && `dnb-table__tr--${currentVariant}`,\n isLast && 'dnb-table__tr--last',\n noWrap && 'dnb-table--no-wrap',\n _className\n )\n\n const accordionTr = useTableAccordion({\n className,\n children,\n props,\n expanded,\n disabled,\n noAnimation,\n onClick,\n onOpened,\n onClosed,\n })\n\n if (accordionTr) {\n return accordionTr\n }\n\n return (\n <tr role=\"row\" className={className} {...props}>\n {children}\n </tr>\n )\n}\n\nfunction useHandleTrVariant({ variant }) {\n const tableContext = React.useContext(TableContext)\n\n /\n Handle odd/even\n /\n const countRef = tableContext?.trCountRef.current\n const increment = () => {\n if (typeof countRef === 'undefined') {\n return 0\n }\n if (\n !variant \|\|\n (variant === 'even' && countRef.count % 2 === 1) \|\|\n (variant === 'odd' && countRef.count % 2 === 0)\n ) {\n countRef.count++\n }\n\n return countRef.count\n }\n\n const [count, setCount] = React.useState(() => {\n // SSR Support\n if (typeof window === 'undefined') {\n return increment()\n }\n })\n\n // StrictMode support\n React.useEffect(() => {\n // SSR will not execute useEffect\n setCount(increment())\n }, [tableContext?.rerenderAlias]) // eslint-disable-line react-hooks/exhaustive-deps\n\n /\n Find out the current odd/even when \"accordionContent\" is used.\n * Because we have now an additional \"tr\" element.\n * Then the CSS can't figure out the correct nth element (nth-of-type)\n * and we need to set it manually (nth-child and nth-of-type do not respect classes, so we can't ignore this one).\n /\n let currentVariant = variant\n if (!currentVariant) {\n currentVariant = count % 2 ? 'odd' : 'even'\n }\n const isLast =\n typeof countRef !== 'undefined' && countRef.count === count\n return {\n currentVariant,\n isLast,\n }\n}\n\n/\n Handle odd/even on re-render and React.StrictMode\n */\nexport function useHandleOddEven({ children }) {\n // Create this ref in order to \"auto\" set even/odd class in tr elements\n const trCountRef = React.useRef({ count: 0 })\n\n // When the alias changes, all tr's will rerender and get a new even/odd color\n // This is useful, when one tr gets removed\n const [rerenderAlias, setRerenderAlias] = React.useState({}) // eslint-disable-line no-unused-vars\n\n const isMounted = React.useRef(false)\n React.useEffect(() => {\n if (isMounted.current) {\n forceRerender()\n }\n isMounted.current = true\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n return { trCountRef, rerenderAlias, setRerenderAlias }\n\n function forceRerender() {\n trCountRef.current.count = 0\n setRerenderAlias({})\n }\n}\n\nTr.AccordionContent = TableAccordionTr\n"],"mappings":"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"}
1	+ {"version":3,"file":"TableTr.js","names":["_react","_interopRequireDefault","require","_classnames","_TableAccordion","_TableContext","_TableAccordionTr","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Tr","componentProps","variant","noWrap","expanded","disabled","noAnimation","onClick","onOpened","onClosed","children","className","_className","props","currentVariant","isLast","useHandleTrVariant","classnames","accordionTr","useTableAccordion","createElement","role","_ref","tableContext","React","useContext","TableContext","countRef","trCountRef","current","increment","count","setCount","useState","window","useEffect","rerenderAlias","useHandleOddEven","_ref2","useRef","setRerenderAlias","isMounted","forceRerender","AccordionContent","TableAccordionTr"],"sources":["../../../../src/components/table/TableTr.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { useTableAccordion } from './TableAccordion'\nimport { TableContext } from './TableContext'\nimport TableAccordionTr from './TableAccordionTr'\n\nexport type TableTrProps = {\n /*\n The variant of the tr\n /\n variant?: 'even' \| 'odd'\n\n /\n If set to true, the inherited header text will not wrap to new lines\n * Default: false\n /\n noWrap?: boolean\n\n /\n Set true to render the tr initially as expanded\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n expanded?: boolean\n\n /\n Set true to disable the tr to be accessible as an interactive element\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n disabled?: boolean\n\n /\n Set to true to skip animation\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n * Default: false\n /\n noAnimation?: boolean\n\n /\n Will emit when user clicks/expands the table row\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onClick?: (event?: React.SyntheticEvent) => void\n\n /\n Will emit when table row is expanded\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onOpened?: (event?: React.SyntheticEvent) => void\n\n /\n Will emit when table row is closed (after it was open)\n * Is part of the accordion feature and needs to be enabled with `accordion` prop in main Table\n /\n onClosed?: (event?: React.SyntheticEvent) => void\n\n /\n The content of the component.\n /\n children: React.ReactNode\n}\n\nexport default function Tr(\n componentProps: TableTrProps &\n React.TableHTMLAttributes<HTMLTableRowElement>\n) {\n const {\n variant,\n noWrap,\n expanded,\n disabled,\n noAnimation,\n onClick,\n onOpened,\n onClosed,\n children,\n className: _className,\n ...props\n } = componentProps\n\n const { currentVariant, isLast } = useHandleTrVariant({\n variant,\n })\n\n const className = classnames(\n 'dnb-table__tr',\n currentVariant && `dnb-table__tr--${currentVariant}`,\n isLast && 'dnb-table__tr--last',\n noWrap && 'dnb-table--no-wrap',\n _className\n )\n\n const accordionTr = useTableAccordion({\n className,\n children,\n props,\n expanded,\n disabled,\n noAnimation,\n onClick,\n onOpened,\n onClosed,\n })\n\n if (accordionTr) {\n return accordionTr\n }\n\n return (\n <tr role=\"row\" className={className} {...props}>\n {children}\n </tr>\n )\n}\n\nfunction useHandleTrVariant({ variant }) {\n const tableContext = React.useContext(TableContext)\n\n /\n Handle odd/even\n /\n const countRef = tableContext?.trCountRef.current\n const increment = () => {\n if (typeof countRef === 'undefined') {\n return 0\n }\n if (\n !variant \|\|\n (variant === 'even' && countRef.count % 2 === 1) \|\|\n (variant === 'odd' && countRef.count % 2 === 0)\n ) {\n countRef.count++\n }\n\n return countRef.count\n }\n\n const [count, setCount] = React.useState(() => {\n // SSR Support\n if (typeof window === 'undefined') {\n return increment()\n }\n })\n\n // StrictMode support\n React.useEffect(() => {\n // SSR will not execute useEffect\n setCount(increment())\n }, [tableContext?.rerenderAlias]) // eslint-disable-line react-hooks/exhaustive-deps\n\n /\n Find out the current odd/even when \"accordionContent\" is used.\n * Because we have now an additional \"tr\" element.\n * Then the CSS can't figure out the correct nth element (nth-of-type)\n * and we need to set it manually (nth-child and nth-of-type do not respect classes, so we can't ignore this one).\n /\n let currentVariant = variant\n if (!currentVariant) {\n currentVariant = count % 2 ? 'odd' : 'even'\n }\n const isLast =\n typeof countRef !== 'undefined' && countRef.count === count\n return {\n currentVariant,\n isLast,\n }\n}\n\n/\n Handle odd/even on re-render and React.StrictMode\n */\nexport function useHandleOddEven({ children }) {\n // Create this ref in order to \"auto\" set even/odd class in tr elements\n const trCountRef = React.useRef({ count: 0 })\n\n // When the alias changes, all tr's will rerender and get a new even/odd color\n // This is useful, when one tr gets removed\n const [rerenderAlias, setRerenderAlias] = React.useState({}) // eslint-disable-line no-unused-vars\n\n const isMounted = React.useRef(false)\n React.useEffect(() => {\n if (isMounted.current) {\n forceRerender()\n }\n isMounted.current = true\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n return { trCountRef, rerenderAlias, setRerenderAlias }\n\n function forceRerender() {\n trCountRef.current.count = 0\n setRerenderAlias({})\n }\n}\n\nTr.AccordionContent = TableAccordionTr\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAL,sBAAA,CAAAC,OAAA;AAAiD,MAAAK,SAAA;AAAA,SAAAN,uBAAAO,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAAA,SAAAQ,yBAAAN,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,GAAAY,6BAAA,CAAAR,MAAA,EAAAO,QAAA,OAAAN,GAAA,EAAAJ,CAAA,MAAAJ,MAAA,CAAAgB,qBAAA,QAAAC,gBAAA,GAAAjB,MAAA,CAAAgB,qBAAA,CAAAT,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAAa,gBAAA,CAAAX,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAS,gBAAA,CAAAb,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,uBAAAR,MAAA,CAAAS,SAAA,CAAAU,oBAAA,CAAAR,IAAA,CAAAJ,MAAA,EAAAC,GAAA,aAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAL,MAAA;AAAA,SAAAY,8BAAAR,MAAA,EAAAO,QAAA,QAAAP,MAAA,yBAAAJ,MAAA,WAAAiB,UAAA,GAAApB,MAAA,CAAAqB,IAAA,CAAAd,MAAA,OAAAC,GAAA,EAAAJ,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAgB,UAAA,CAAAd,MAAA,EAAAF,CAAA,MAAAI,GAAA,GAAAY,UAAA,CAAAhB,CAAA,OAAAU,QAAA,CAAAI,OAAA,CAAAV,GAAA,kBAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAL,MAAA;AA2DlC,SAASmB,EAAEA,CACxBC,cACgD,EAChD;EACA,MAAM;MACJC,OAAO;MACPC,MAAM;MACNC,QAAQ;MACRC,QAAQ;MACRC,WAAW;MACXC,OAAO;MACPC,QAAQ;MACRC,QAAQ;MACRC,QAAQ;MACRC,SAAS,EAAEC;IAEb,CAAC,GAAGX,cAAc;IADbY,KAAK,GAAAtB,wBAAA,CACNU,cAAc,EAAA5B,SAAA;EAElB,MAAM;IAAEyC,cAAc;IAAEC;EAAO,CAAC,GAAGC,kBAAkB,CAAC;IACpDd;EACF,CAAC,CAAC;EAEF,MAAMS,SAAS,GAAG,IAAAM,mBAAU,EAC1B,eAAe,EAIfL,UAAU,EAHVE,cAAc,IAAK,kBAAiBA,cAAe,EAAC,EACpDC,MAAM,IAAI,qBAAqB,EAC/BZ,MAAM,IAAI,oBAEZ,CAAC;EAED,MAAMe,WAAW,GAAG,IAAAC,iCAAiB,EAAC;IACpCR,SAAS;IACTD,QAAQ;IACRG,KAAK;IACLT,QAAQ;IACRC,QAAQ;IACRC,WAAW;IACXC,OAAO;IACPC,QAAQ;IACRC;EACF,CAAC,CAAC;EAEF,IAAIS,WAAW,EAAE;IACf,OAAOA,WAAW;EACpB;EAEA,OACEpD,MAAA,CAAAU,OAAA,CAAA4C,aAAA,OAAA3C,QAAA;IAAI4C,IAAI,EAAC,KAAK;IAACV,SAAS,EAAEA;EAAU,GAAKE,KAAK,GAC3CH,QACC,CAAC;AAET;AAEA,SAASM,kBAAkBA,CAAAM,IAAA,EAAc;EAAA,IAAb;IAAEpB;EAAQ,CAAC,GAAAoB,IAAA;EACrC,MAAMC,YAAY,GAAGC,cAAK,CAACC,UAAU,CAACC,0BAAY,CAAC;EAKnD,MAAMC,QAAQ,GAAGJ,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAEK,UAAU,CAACC,OAAO;EACjD,MAAMC,SAAS,GAAGA,CAAA,KAAM;IACtB,IAAI,OAAOH,QAAQ,KAAK,WAAW,EAAE;MACnC,OAAO,CAAC;IACV;IACA,IACE,CAACzB,OAAO,IACPA,OAAO,KAAK,MAAM,IAAIyB,QAAQ,CAACI,KAAK,GAAG,CAAC,KAAK,CAAE,IAC/C7B,OAAO,KAAK,KAAK,IAAIyB,QAAQ,CAACI,KAAK,GAAG,CAAC,KAAK,CAAE,EAC/C;MACAJ,QAAQ,CAACI,KAAK,EAAE;IAClB;IAEA,OAAOJ,QAAQ,CAACI,KAAK;EACvB,CAAC;EAED,MAAM,CAACA,KAAK,EAAEC,QAAQ,CAAC,GAAGR,cAAK,CAACS,QAAQ,CAAC,MAAM;IAE7C,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;MACjC,OAAOJ,SAAS,CAAC,CAAC;IACpB;EACF,CAAC,CAAC;EAGFN,cAAK,CAACW,SAAS,CAAC,MAAM;IAEpBH,QAAQ,CAACF,SAAS,CAAC,CAAC,CAAC;EACvB,CAAC,EAAE,CAACP,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAEa,aAAa,CAAC,CAAC;EAQjC,IAAItB,cAAc,GAAGZ,OAAO;EAC5B,IAAI,CAACY,cAAc,EAAE;IACnBA,cAAc,GAAGiB,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,MAAM;EAC7C;EACA,MAAMhB,MAAM,GACV,OAAOY,QAAQ,KAAK,WAAW,IAAIA,QAAQ,CAACI,KAAK,KAAKA,KAAK;EAC7D,OAAO;IACLjB,cAAc;IACdC;EACF,CAAC;AACH;AAKO,SAASsB,gBAAgBA,CAAAC,KAAA,EAAe;EAAA,IAAd;IAAE5B;EAAS,CAAC,GAAA4B,KAAA;EAE3C,MAAMV,UAAU,GAAGJ,cAAK,CAACe,MAAM,CAAC;IAAER,KAAK,EAAE;EAAE,CAAC,CAAC;EAI7C,MAAM,CAACK,aAAa,EAAEI,gBAAgB,CAAC,GAAGhB,cAAK,CAACS,QAAQ,CAAC,CAAC,CAAC,CAAC;EAE5D,MAAMQ,SAAS,GAAGjB,cAAK,CAACe,MAAM,CAAC,KAAK,CAAC;EACrCf,cAAK,CAACW,SAAS,CAAC,MAAM;IACpB,IAAIM,SAAS,CAACZ,OAAO,EAAE;MACrBa,aAAa,CAAC,CAAC;IACjB;IACAD,SAAS,CAACZ,OAAO,GAAG,IAAI;EAC1B,CAAC,EAAE,CAACnB,QAAQ,CAAC,CAAC;EAEd,OAAO;IAAEkB,UAAU;IAAEQ,aAAa;IAAEI;EAAiB,CAAC;EAEtD,SAASE,aAAaA,CAAA,EAAG;IACvBd,UAAU,CAACC,OAAO,CAACE,KAAK,GAAG,CAAC;IAC5BS,gBAAgB,CAAC,CAAC,CAAC,CAAC;EACtB;AACF;AAEAxC,EAAE,CAAC2C,gBAAgB,GAAGC,yBAAgB"}

package/cjs/components/table/style/dnb-table.css CHANGED Viewed

@@ -103,6 +103,10 @@
 .dnb-table.dnb-skeleton > * {
   -webkit-text-fill-color: var(--skeleton-color);
 }
+.dnb-card .dnb-table {
+  --table-outline-color: transparent;
+  margin-bottom: 0;
+}
 .dnb-table > thead > tr > th.dnb-table--sortable, .dnb-table .dnb-table__th.dnb-table--sortable {
   color: var(--color-sea-green);
 }
@@ -133,7 +137,7 @@ html[data-visual-test] .dnb-table > thead > tr > th.dnb-table--sortable .dnb-tab
   line-height: inherit;
 }
 .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text::after, .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text::after {
-  right: 1rem;
+  right: 0;
 }
 .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon, .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon {
   align-self: flex-end;
@@ -245,6 +249,9 @@ html[data-whatinput=touch] .dnb-table > thead > tr > th.dnb-table--sortable .dnb
 .dnb-table > thead > tr > th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right, .dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right {
   padding-right: 0.5rem;
 }
+.dnb-table > thead > tr > th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon, .dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon {
+  margin-left: -0.5rem;
+}
 .dnb-table > thead > tr > th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text, .dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text {
   padding-right: 0;
 }
@@ -299,6 +306,12 @@ html[data-whatinput=keyboard] .dnb-table > thead > tr > th.dnb-table--active .dn
   display: flex;
   align-items: flex-end;
 }
+.dnb-table__th, .dnb-table thead th {
+  background-color: var(--table-th-background-color);
+}
+.dnb-table tbody tr:has(th:first-child + td:last-child) th[scope=row] {
+  --table-th-background-color: initial;
+}
 /*
 * Table component