@dnb/eufemia 10.13.0 → 10.15.0

package/components/radio/style/themes/dnb-radio-theme-ui.scss

@@ -3,148 +3,36 @@
 *
 */
 
-@import '../../../../style/core/utilities.scss';
-
 .dnb-radio {
-  &__dot {
-    background-color: var(--color-sea-green);
-    transition:
-      opacity 200ms ease-out,
-      transform 200ms ease-out;
-  }
-
-  // When radio is ON
-  &__input:checked ~ &__button,
-  &__input[data-checked='true'] ~ &__button {
-    background-color: var(--color-white);
-    border-color: var(--color-sea-green);
-  }
-  &__input:checked ~ &__dot,
-  &__input[data-checked='true'] ~ &__dot {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  // When radio is OFF
-  &__input:not(:checked):not([data-checked='true']) ~ &__dot {
-    opacity: 0;
-    transform: scale(0.8);
-  }
-  &__input:not(:checked):not([data-checked='true']) ~ &__button {
-    background-color: var(--color-white);
-    border-color: var(--color-sea-green);
-  }
-
-  // On disabled
-  &__input[disabled]:checked ~ &__button,
-  &__input[disabled][data-checked='true'] ~ &__button {
-    border-color: var(--color-sea-green-30);
-  }
-  &__input[disabled]:not(:checked):not([data-checked='true']) ~ &__button {
-    border-color: var(--color-mint-green-50);
-  }
-  &__input[disabled]:checked ~ &__dot,
-  &__input[disabled][data-checked='true'] ~ &__dot {
-    background-color: var(--color-sea-green-30);
-  }
-
-  // On active
-  &__input:not([disabled]):checked:active ~ &__button,
-  &__input:not([disabled])[data-checked='true']:active ~ &__button {
-    border-color: var(--color-mint-green-50);
-  }
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):active
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-    border-color: transparent;
-  }
-  &__input:not([disabled]):checked:active ~ &__dot,
-  &__input:not([disabled])[data-checked='true']:active ~ &__dot {
-    background-color: var(--color-mint-green-50);
-  }
-
-  // On hover
-  &__input:not([disabled]):not(:focus):not(:checked):not(
-      [data-checked='true']
-    ):hover
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-  }
-  &__input:not([disabled]):not(:focus):checked:hover ~ &__dot,
-  &__input:not([disabled]):not(:focus)[data-checked='true']:hover
-    ~ &__dot {
-    background-color: var(--color-mint-green-50);
-  }
-
-  // On focus
-  /* stylelint-disable */
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):focus
-    ~ &__button {
-    html[data-whatinput='keyboard'] & {
-      background-color: var(--color-mint-green-50);
-    }
-  }
-  &__input:not([disabled]):focus ~ &__button {
-    html[data-whatinput='keyboard'] & {
-      border: none;
-    }
-  }
-  &__input:not([disabled]):focus ~ &__focus,
-  &__input:not([disabled]):active ~ &__focus {
-    display: block;
-  }
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):focus
-    ~ &__button,
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):active
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-  }
-  /* stylelint-enable */
-
-  // On error state
-  /* stylelint-disable */
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active)
-    ~ &__button {
-    border: none;
-  }
-  /* stylelint-enable */
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active)
-    ~ &__focus {
-    display: block;
-    @include fakeBorder(var(--color-fire-red), var(--focus-ring-width));
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:checked):not(
-      [data-checked='true']
-    ):hover
-    ~ &__button {
-    background-color: var(--color-fire-red-8);
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):not(:hover):checked
-    ~ &__dot,
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):not(
-      :hover
-    )[data-checked='true']
-    ~ &__dot {
-    background-color: var(--color-fire-red);
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):checked:hover
-    ~ &__dot,
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(
-      :active
-    )[data-checked='true']:hover
-    ~ &__dot {
-    background-color: var(--color-fire-red-8);
-  }
-
-  // adjust the form-status to the inner border for 3px
-  > .dnb-form-status {
-    transform: translateY(0.25rem); /* 4/16 */
-  }
+  // Normal state
+  --radio-color-dot-on: var(--color-sea-green);
+  --radio-color-background-on: var(--color-white);
+  --radio-color-border-on: var(--color-sea-green);
+  --radio-color-background-off: var(--color-white);
+  --radio-color-border-off: var(--color-sea-green);
+  // Disabled state
+  --radio-color-dot-on--disabled: var(--color-sea-green-30);
+  --radio-color-background--disabled: var(--color-white);
+  --radio-color-border-on--disabled: var(--color-sea-green-30);
+  --radio-color-border-off--disabled: var(--color-mint-green-50);
+  // Active state
+  --radio-color-dot-on--active: var(--color-mint-green-50);
+  --radio-color-border-on--active: var(--color-mint-green-50);
+  --radio-color-background-off--active: var(--color-mint-green-50);
+  --radio-color-border-off--active: transparent;
+  // Hover state
+  --radio-color-dot-on--hover: var(--color-mint-green-50);
+  --radio-color-background-on--hover: var(--color-white);
+  --radio-color-background-off--hover: var(--color-mint-green-50);
+  // Focus state
+  --radio-color-dot-on--focus: var(--color-sea-green);
+  --radio-color-background-on--focus: var(--color-white);
+  --radio-color-background-off--focus: var(--color-mint-green-50);
+  // Error state
+  --radio-color-dot-on--error: var(--color-fire-red);
+  --radio-color-border-on--error: var(--color-fire-red);
+  --radio-color-border--error-hover: var(--radio-color-border-on--error);
+  --radio-color-background-off--error-hover: var(--color-fire-red-8);
+  --radio-color-background-on--error-hover: var(--color-white);
+  --radio-color-dot-on--error-hover: var(--color-fire-red-8);
 }

package/components/section/Section.d.ts

@@ -30,6 +30,7 @@ export type SectionSpacing = boolean | 'x-small' | 'small' | 'medium' | 'large'
 export type TextColor = string;
 export type OutlineColor = string | boolean;
 export type BackgroundColor = string;
+export type DropShadow = boolean;
 export type SectionProps = {
     /**
      * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop
@@ -55,6 +56,10 @@ export type SectionProps = {
      * Define a custom background color, instead of a variant. Use a Eufemia color.
      */
     backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>;
+    /**
+     * Define a custom drop-shadow.
+     */
+    dropShadow?: DropShadow | ResponsiveProp<DropShadow>;
     /**
      * Define what HTML element should be used. Defaults to `<section>`.
      */

package/components/section/Section.js

@@ -1,7 +1,9 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["element", "variant", "breakout", "roundedCorner", "textColor", "backgroundColor", "outline", "innerRef", "className", "children", "spacing", "style_type", "inner_ref"];
+const _excluded = ["element", "variant", "breakout", "roundedCorner", "textColor", "backgroundColor", "dropShadow", "outline", "innerRef", "className", "children", "spacing", "style_type", "inner_ref"];
 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; }
 import React from 'react';
@@ -22,6 +24,7 @@ export default function Section(localProps) {
       roundedCorner,
       textColor,
       backgroundColor,
+      dropShadow,
       outline,
       innerRef,
       className,
@@ -37,7 +40,7 @@ export default function Section(localProps) {
   const internalRef = React.useRef();
   const elementRef = innerRef || inner_ref || internalRef;
   params.innerRef = elementRef;
-  const styleObj = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(roundedCorner, 'rounded-corner', value => value && 'var(--rounded-corner--value)')), computeStyle(textColor, 'text-color', value => getColor(value))), computeStyle(backgroundColor, 'background-color', value => getColor(value))), computeStyle(outline, 'outline-color', value => String(value) === 'true' ? 'var(--outline-color--value)' : getColor(value))), params === null || params === void 0 ? void 0 : params.style);
+  const styleObj = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(roundedCorner, 'rounded-corner', value => value && 'var(--rounded-corner--value)')), computeStyle(textColor, 'text-color', value => getColor(value))), computeStyle(backgroundColor, 'background-color', value => getColor(value))), computeStyle(dropShadow, 'drop-shadow', value => value && 'var(--shadow-default)')), computeStyle(outline, 'outline-color', value => String(value) === 'true' ? 'var(--outline-color--value)' : getColor(value))), params === null || params === void 0 ? void 0 : params.style);
   return React.createElement(Space, _extends({}, params, {
     element: element,
     style: styleObj

package/components/section/Section.js.map

@@ -1 +1 @@
-{"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","defaultProps","element","Section","localProps","context","useContext","props","variant","breakout","roundedCorner","textColor","backgroundColor","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","params","_objectSpread","internalRef","useRef","elementRef","styleObj","computeStyle","value","getColor","String","style","createElement","_extends","test","undefined","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype Attributes = Record<string, unknown> & { style?: React.CSSProperties }\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    element,\n    variant,\n    breakout = true,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const params = {\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    ...attributes,\n  } as Attributes\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n  params.innerRef = elementRef\n\n  const styleObj = {\n    ...computeStyle(\n      breakout,\n      'breakout',\n      (value) => `var(--breakout--${value ? 'on' : 'off'})`\n    ),\n    ...computeStyle(\n      roundedCorner,\n      'rounded-corner',\n      (value) => value && 'var(--rounded-corner--value)'\n    ),\n    ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n    ...computeStyle(backgroundColor, 'background-color', (value) =>\n      getColor(value)\n    ),\n    ...computeStyle(outline, 'outline-color', (value) =>\n      String(value) === 'true'\n        ? 'var(--outline-color--value)'\n        : getColor(value)\n    ),\n    ...params?.style,\n  } as React.CSSProperties\n\n  return (\n    <Space {...params} element={element} style={styleObj}>\n      {children}\n    </Space>\n  )\n}\n\nfunction getColor(value: string) {\n  return value\n    ? !/#|var/.test(value)\n      ? `var(--color-${value})`\n      : value\n    : undefined\n}\n\nfunction computeStyle(\n  property: ResponsiveProp<unknown> | boolean | string,\n  name: string,\n  valueCallback: (value: string) => string | undefined\n) {\n  let media = property as ResponsiveProp<unknown>\n\n  if (media !== null && typeof media !== 'object') {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<unknown>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<unknown>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","defaultProps","element","Section","localProps","context","useContext","props","variant","breakout","roundedCorner","textColor","backgroundColor","dropShadow","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","params","_objectSpread","internalRef","useRef","elementRef","styleObj","computeStyle","value","getColor","String","style","createElement","_extends","test","undefined","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\nexport type DropShadow = boolean\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define a custom drop-shadow.\n   */\n  dropShadow?: DropShadow | ResponsiveProp<DropShadow>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype Attributes = Record<string, unknown> & { style?: React.CSSProperties }\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    element,\n    variant,\n    breakout = true,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    dropShadow,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const params = {\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    ...attributes,\n  } as Attributes\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n  params.innerRef = elementRef\n\n  const styleObj = {\n    ...computeStyle(\n      breakout,\n      'breakout',\n      (value) => `var(--breakout--${value ? 'on' : 'off'})`\n    ),\n    ...computeStyle(\n      roundedCorner,\n      'rounded-corner',\n      (value) => value && 'var(--rounded-corner--value)'\n    ),\n    ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n    ...computeStyle(backgroundColor, 'background-color', (value) =>\n      getColor(value)\n    ),\n    ...computeStyle(\n      dropShadow,\n      'drop-shadow',\n      (value) => value && 'var(--shadow-default)'\n    ),\n    ...computeStyle(outline, 'outline-color', (value) =>\n      String(value) === 'true'\n        ? 'var(--outline-color--value)'\n        : getColor(value)\n    ),\n    ...params?.style,\n  } as React.CSSProperties\n\n  return (\n    <Space {...params} element={element} style={styleObj}>\n      {children}\n    </Space>\n  )\n}\n\nfunction getColor(value: string) {\n  return value\n    ? !/#|var/.test(value)\n      ? `var(--color-${value})`\n      : value\n    : undefined\n}\n\nfunction computeStyle(\n  property: ResponsiveProp<unknown> | boolean | string,\n  name: string,\n  valueCallback: (value: string) => string | undefined\n) {\n  let media = property as ResponsiveProp<unknown>\n\n  if (media !== null && typeof media !== 'object') {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<unknown>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<unknown>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/section/style/dnb-section.css

@@ -23,6 +23,15 @@
 .dnb-section[style*="--background-color"] {
   background-color: var(--background-color, white);
 }
+.dnb-section::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  box-shadow: var(--drop-shadow, none);
+}
 .dnb-section::after {
   content: "";
   visibility: var(--breakout, hidden);
@@ -47,6 +56,7 @@
     --background-color--value: var(--background-color--small);
     --text-color--value: var(--text-color--small);
     --outline-color: var(--outline-color--small);
+    --drop-shadow: var(--drop-shadow--small);
     --rounded-corner: var(
       --rounded-corner--small,
       var(--rounded-corner--fallback)
@@ -59,6 +69,7 @@
     --background-color--value: var(--background-color--medium);
     --text-color--value: var(--text-color--medium);
     --outline-color: var(--outline-color--medium);
+    --drop-shadow: var(--drop-shadow--medium);
     --rounded-corner: var(
       --rounded-corner--medium,
       var(--rounded-corner--fallback)
@@ -71,6 +82,7 @@
     --background-color--value: var(--background-color--large);
     --text-color--value: var(--text-color--large);
     --outline-color: var(--outline-color--large);
+    --drop-shadow: var(--drop-shadow--large);
     --rounded-corner: var(
       --rounded-corner--large,
       var(--rounded-corner--fallback)

package/components/section/style/dnb-section.min.css

@@ -1,7 +1,7 @@
-.dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.75rem;--outline:0 0 0 1px var(--outline-color,transparent);--top:0;--left:-100vw;--width:100vw;--height:100%;border-radius:var(--rounded-corner,0);box-shadow:var(--outline,none);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);content:"";height:var(--height);left:var(--left);position:absolute;top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--rounded-corner:var(
+.dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.75rem;--outline:0 0 0 1px var(--outline-color,transparent);--top:0;--left:-100vw;--width:100vw;--height:100%;border-radius:var(--rounded-corner,0);box-shadow:var(--outline,none);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:before{bottom:0;box-shadow:var(--drop-shadow,none);content:"";left:0;position:absolute;right:0;top:0}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);content:"";height:var(--height);left:var(--left);position:absolute;top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--drop-shadow:var(--drop-shadow--small);--rounded-corner:var(
       --rounded-corner--small,var(--rounded-corner--fallback)
-    )}}@media screen and (max-width:59.9375em) and (min-width:40.0625em){.dnb-section{--breakout:var(--breakout--medium,var(--breakout--fallback));--background-color--value:var(--background-color--medium);--text-color--value:var(--text-color--medium);--outline-color:var(--outline-color--medium);--rounded-corner:var(
+    )}}@media screen and (max-width:59.9375em) and (min-width:40.0625em){.dnb-section{--breakout:var(--breakout--medium,var(--breakout--fallback));--background-color--value:var(--background-color--medium);--text-color--value:var(--text-color--medium);--outline-color:var(--outline-color--medium);--drop-shadow:var(--drop-shadow--medium);--rounded-corner:var(
       --rounded-corner--medium,var(--rounded-corner--fallback)
-    )}}@media screen and (min-width:60em){.dnb-section{--breakout:var(--breakout--large,var(--breakout--fallback));--background-color--value:var(--background-color--large);--text-color--value:var(--text-color--large);--outline-color:var(--outline-color--large);--rounded-corner:var(
+    )}}@media screen and (min-width:60em){.dnb-section{--breakout:var(--breakout--large,var(--breakout--fallback));--background-color--value:var(--background-color--large);--text-color--value:var(--text-color--large);--outline-color:var(--outline-color--large);--drop-shadow:var(--drop-shadow--large);--rounded-corner:var(
       --rounded-corner--large,var(--rounded-corner--fallback)
     )}}.dnb-section .dnb-section:after{z-index:-14}.dnb-section .dnb-section .dnb-section:after{z-index:-13}.dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-12}.dnb-section .dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-11}.dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-10}.dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-9}.dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-8}.dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section .dnb-section:after{z-index:-7}.dnb-section--spacing-x-small{padding-bottom:var(--spacing-x-small);padding-top:var(--spacing-x-small)}.dnb-section--spacing-small{padding-bottom:var(--spacing-small);padding-top:var(--spacing-small)}.dnb-section--spacing-medium{padding-bottom:var(--spacing-medium);padding-top:var(--spacing-medium)}.dnb-section--spacing,.dnb-section--spacing-large{padding-bottom:var(--spacing-large);padding-top:var(--spacing-large)}.dnb-section--spacing-x-large{padding-bottom:var(--spacing-x-large);padding-top:var(--spacing-x-large)}.dnb-section--spacing-xx-large{padding-bottom:var(--spacing-xx-large);padding-top:var(--spacing-xx-large)}

package/components/section/style/dnb-section.scss

@@ -29,6 +29,13 @@
     background-color: var(--background-color, white);
   }
 
+  &::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    box-shadow: var(--drop-shadow, none);
+  }
+
   &::after {
     content: '';
     visibility: var(--breakout, hidden);
@@ -58,6 +65,7 @@
     --background-color--value: var(--background-color--small);
     --text-color--value: var(--text-color--small);
     --outline-color: var(--outline-color--small);
+    --drop-shadow: var(--drop-shadow--small);
     --rounded-corner: var(
       --rounded-corner--small,
       var(--rounded-corner--fallback)
@@ -68,6 +76,7 @@
     --background-color--value: var(--background-color--medium);
     --text-color--value: var(--text-color--medium);
     --outline-color: var(--outline-color--medium);
+    --drop-shadow: var(--drop-shadow--medium);
     --rounded-corner: var(
       --rounded-corner--medium,
       var(--rounded-corner--fallback)
@@ -78,6 +87,7 @@
     --background-color--value: var(--background-color--large);
     --text-color--value: var(--text-color--large);
     --outline-color: var(--outline-color--large);
+    --drop-shadow: var(--drop-shadow--large);
     --rounded-corner: var(
       --rounded-corner--large,
       var(--rounded-corner--fallback)

package/components/skeleton/Skeleton.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","validateDOMAttributes","isTrue","LOCALE","Space","spacingPropTypes","createSpacingClasses","Context","Provider","Skeleton","PureComponent","constructor","props","state","ariaLiveUpdate","componentWillUnmount","clearTimeout","_ariaLiveUpdateTimeout","componentDidUpdate","prevProps","show","setAriaLiveUpdate","getProps","arguments","length","undefined","context","defaultProps","skeleton","no_animation","skeleton_no_animation","getTranslation","setTimeout","aria_busy","aria_ready","newString","setState","render","figure","className","class","_className","children","attributes","_objectWithoutProperties","_excluded","showSkeleton","params","_objectSpread","lang","locale","createElement","_defineProperty","element","process","env","NODE_ENV","propTypes","oneOfType","string","bool","func","node","Exclude","_extends","_supportsSpacingProps"],"sources":["../../../../src/components/skeleton/Skeleton.js"],"sourcesContent":["/**\n * Web Skeleton Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  isTrue,\n} from '../../shared/component-helper'\nimport { LOCALE } from '../../shared/defaults'\nimport Space from '../space/Space'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport Context from '../../shared/Context'\nimport Provider from '../../shared/Provider'\n\nexport default class Skeleton extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    show: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    figure: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    aria_busy: PropTypes.string,\n    aria_ready: PropTypes.string,\n    element: PropTypes.node,\n\n    ...spacingPropTypes,\n\n    class: PropTypes.string,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    show: null,\n    skeleton: null, // only to make sure we process extendPropsWithContextInClassComponent\n    no_animation: null,\n    figure: null,\n    aria_busy: null,\n    aria_ready: null,\n    element: null,\n    class: null,\n    className: null,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n    this.state = { ariaLiveUpdate: null }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._ariaLiveUpdateTimeout)\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.show !== this.props.show) {\n      this.setAriaLiveUpdate()\n    }\n  }\n\n  getProps(props = this.props, context = this.context) {\n    return extendPropsWithContextInClassComponent(\n      props,\n      Skeleton.defaultProps,\n      {\n        skeleton: context.Skeleton || context.skeleton,\n        no_animation: context.skeleton_no_animation,\n      },\n      context.getTranslation(props).Skeleton\n    )\n  }\n\n  setAriaLiveUpdate() {\n    // this is only to make a better screen reader ux\n    clearTimeout(this._ariaLiveUpdateTimeout)\n    this._ariaLiveUpdateTimeout = setTimeout(() => {\n      const { aria_busy, aria_ready } = this.getProps()\n\n      let newString = null\n\n      if (isTrue(this.props.show)) {\n        newString = aria_busy\n      } else {\n        newString = aria_ready\n      }\n\n      if (newString) {\n        this.setState({\n          ariaLiveUpdate: newString,\n        })\n        this._ariaLiveUpdateTimeout = setTimeout(() => {\n          this.setState({\n            ariaLiveUpdate: null,\n          })\n        }, 1e3)\n      }\n    }, 1e3) // so that the input gets read out first, and then the results\n  }\n\n  render() {\n    // consume the skeleton context\n    const props = this.getProps()\n\n    const {\n      show,\n      no_animation,\n      figure,\n      skeleton,\n      aria_busy,\n      aria_ready, // eslint-disable-line\n      className,\n      class: _className,\n      children,\n\n      ...attributes\n    } = props\n\n    const { ariaLiveUpdate } = this.state\n\n    const showSkeleton =\n      typeof show === 'boolean' || typeof show === 'string'\n        ? isTrue(show)\n        : skeleton\n\n    const params = {\n      className: classnames(\n        figure ? 'dnb-skeleton__figure' : 'dnb-skeleton__root',\n        isTrue(showSkeleton) && 'dnb-skeleton',\n        isTrue(no_animation) && 'dnb-skeleton--no-animation',\n        createSpacingClasses(props),\n        className,\n        _className\n      ),\n      // role: 'status',// is not needed as for now\n      'aria-busy': showSkeleton,\n      'aria-label': showSkeleton ? aria_busy : undefined,\n      lang: this.context.locale || LOCALE,\n      ...attributes,\n    }\n\n    validateDOMAttributes(props, params)\n\n    return (\n      <Space {...params}>\n        {figure ? (\n          showSkeleton ? (\n            typeof figure === 'function' ? (\n              figure()\n            ) : (\n              figure\n            )\n          ) : (\n            children\n          )\n        ) : (\n          <Provider\n            skeleton={showSkeleton}\n            skeleton_no_animation={no_animation}\n          >\n            {children}\n          </Provider>\n        )}\n        <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n          {ariaLiveUpdate}\n        </span>\n      </Space>\n    )\n  }\n}\n\nfunction Exclude(props) {\n  return <Provider {...props} skeleton={false} />\n}\n\nSkeleton.Exclude = Exclude\n\nSkeleton._supportsSpacingProps = true\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,sCAAsC,EACtCC,qBAAqB,EACrBC,MAAM,QACD,+BAA+B;AACtC,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAOC,KAAK,MAAM,gBAAgB;AAClC,SACEC,gBAAgB,EAChBC,oBAAoB,QACf,wBAAwB;AAC/B,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,OAAOC,QAAQ,MAAM,uBAAuB;AAE5C,eAAe,MAAMC,QAAQ,SAASZ,KAAK,CAACa,aAAa,CAAC;EAuCxDC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MAAEC,cAAc,EAAE;IAAK,CAAC;EACvC;EAEAC,oBAAoBA,CAAA,EAAG;IACrBC,YAAY,CAAC,IAAI,CAACC,sBAAsB,CAAC;EAC3C;EAEAC,kBAAkBA,CAACC,SAAS,EAAE;IAC5B,IAAIA,SAAS,CAACC,IAAI,KAAK,IAAI,CAACR,KAAK,CAACQ,IAAI,EAAE;MACtC,IAAI,CAACC,iBAAiB,CAAC,CAAC;IAC1B;EACF;EAEAC,QAAQA,CAAA,EAA6C;IAAA,IAA5CV,KAAK,GAAAW,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI,CAACX,KAAK;IAAA,IAAEc,OAAO,GAAAH,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI,CAACG,OAAO;IACjD,OAAO1B,sCAAsC,CAC3CY,KAAK,EACLH,QAAQ,CAACkB,YAAY,EACrB;MACEC,QAAQ,EAAEF,OAAO,CAACjB,QAAQ,IAAIiB,OAAO,CAACE,QAAQ;MAC9CC,YAAY,EAAEH,OAAO,CAACI;IACxB,CAAC,EACDJ,OAAO,CAACK,cAAc,CAACnB,KAAK,CAAC,CAACH,QAChC,CAAC;EACH;EAEAY,iBAAiBA,CAAA,EAAG;IAElBL,YAAY,CAAC,IAAI,CAACC,sBAAsB,CAAC;IACzC,IAAI,CAACA,sBAAsB,GAAGe,UAAU,CAAC,MAAM;MAC7C,MAAM;QAAEC,SAAS;QAAEC;MAAW,CAAC,GAAG,IAAI,CAACZ,QAAQ,CAAC,CAAC;MAEjD,IAAIa,SAAS,GAAG,IAAI;MAEpB,IAAIjC,MAAM,CAAC,IAAI,CAACU,KAAK,CAACQ,IAAI,CAAC,EAAE;QAC3Be,SAAS,GAAGF,SAAS;MACvB,CAAC,MAAM;QACLE,SAAS,GAAGD,UAAU;MACxB;MAEA,IAAIC,SAAS,EAAE;QACb,IAAI,CAACC,QAAQ,CAAC;UACZtB,cAAc,EAAEqB;QAClB,CAAC,CAAC;QACF,IAAI,CAAClB,sBAAsB,GAAGe,UAAU,CAAC,MAAM;UAC7C,IAAI,CAACI,QAAQ,CAAC;YACZtB,cAAc,EAAE;UAClB,CAAC,CAAC;QACJ,CAAC,EAAE,GAAG,CAAC;MACT;IACF,CAAC,EAAE,GAAG,CAAC;EACT;EAEAuB,MAAMA,CAAA,EAAG;IAEP,MAAMzB,KAAK,GAAG,IAAI,CAACU,QAAQ,CAAC,CAAC;IAE7B,MAAM;QACJF,IAAI;QACJS,YAAY;QACZS,MAAM;QACNV,QAAQ;QACRK,SAAS;QACTC,UAAU;QACVK,SAAS;QACTC,KAAK,EAAEC,UAAU;QACjBC;MAGF,CAAC,GAAG9B,KAAK;MADJ+B,UAAU,GAAAC,wBAAA,CACXhC,KAAK,EAAAiC,SAAA;IAET,MAAM;MAAE/B;IAAe,CAAC,GAAG,IAAI,CAACD,KAAK;IAErC,MAAMiC,YAAY,GAChB,OAAO1B,IAAI,KAAK,SAAS,IAAI,OAAOA,IAAI,KAAK,QAAQ,GACjDlB,MAAM,CAACkB,IAAI,CAAC,GACZQ,QAAQ;IAEd,MAAMmB,MAAM,GAAAC,aAAA;MACVT,SAAS,EAAExC,UAAU,CACnBuC,MAAM,GAAG,sBAAsB,GAAG,oBAAoB,EAGtDhC,oBAAoB,CAACM,KAAK,CAAC,EAC3B2B,SAAS,EACTE,UAAU,EAJVvC,MAAM,CAAC4C,YAAY,CAAC,IAAI,cAAc,EACtC5C,MAAM,CAAC2B,YAAY,CAAC,IAAI,4BAI1B,CAAC;MAED,WAAW,EAAEiB,YAAY;MACzB,YAAY,EAAEA,YAAY,GAAGb,SAAS,GAAGR,SAAS;MAClDwB,IAAI,EAAE,IAAI,CAACvB,OAAO,CAACwB,MAAM,IAAI/C;IAAM,GAChCwC,UAAU,CACd;IAED1C,qBAAqB,CAACW,KAAK,EAAEmC,MAAM,CAAC;IAEpC,OACElD,KAAA,CAAAsD,aAAA,CAAC/C,KAAK,EAAK2C,MAAM,EACdT,MAAM,GACLQ,YAAY,GACV,OAAOR,MAAM,KAAK,UAAU,GAC1BA,MAAM,CAAC,CAAC,GAERA,MACD,GAEDI,QACD,GAED7C,KAAA,CAAAsD,aAAA,CAAC3C,QAAQ;MACPoB,QAAQ,EAAEkB,YAAa;MACvBhB,qBAAqB,EAAED;IAAa,GAEnCa,QACO,CACX,EACD7C,KAAA,CAAAsD,aAAA;MAAMZ,SAAS,EAAC,aAAa;MAAC,aAAU;IAAW,GAChDzB,cACG,CACD,CAAC;EAEZ;AACF;AAACsC,eAAA,CAlKoB3C,QAAQ,iBACNF,OAAO;AAAA6C,eAAA,CADT3C,QAAQ,kBA0BL;EACpBW,IAAI,EAAE,IAAI;EACVQ,QAAQ,EAAE,IAAI;EACdC,YAAY,EAAE,IAAI;EAClBS,MAAM,EAAE,IAAI;EACZL,SAAS,EAAE,IAAI;EACfC,UAAU,EAAE,IAAI;EAChBmB,OAAO,EAAE,IAAI;EACbb,KAAK,EAAE,IAAI;EACXD,SAAS,EAAE,IAAI;EACfG,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBArCkB/C,QAAQ,CAGpBgD,SAAS,GAAAT,aAAA,CAAAA,aAAA;EACd5B,IAAI,EAAEtB,SAAS,CAAC4D,SAAS,CAAC,CAAC5D,SAAS,CAAC6D,MAAM,EAAE7D,SAAS,CAAC8D,IAAI,CAAC,CAAC;EAC7D/B,YAAY,EAAE/B,SAAS,CAAC4D,SAAS,CAAC,CAAC5D,SAAS,CAAC6D,MAAM,EAAE7D,SAAS,CAAC8D,IAAI,CAAC,CAAC;EACrEtB,MAAM,EAAExC,SAAS,CAAC4D,SAAS,CAAC,CAC1B5D,SAAS,CAAC6D,MAAM,EAChB7D,SAAS,CAAC+D,IAAI,EACd/D,SAAS,CAACgE,IAAI,CACf,CAAC;EACF7B,SAAS,EAAEnC,SAAS,CAAC6D,MAAM;EAC3BzB,UAAU,EAAEpC,SAAS,CAAC6D,MAAM;EAC5BN,OAAO,EAAEvD,SAAS,CAACgE;AAAI,GAEpBzD,gBAAgB;EAEnBmC,KAAK,EAAE1C,SAAS,CAAC6D,MAAM;EACvBpB,SAAS,EAAEzC,SAAS,CAAC6D,MAAM;EAC3BjB,QAAQ,EAAE5C,SAAS,CAAC4D,SAAS,CAAC,CAC5B5D,SAAS,CAAC6D,MAAM,EAChB7D,SAAS,CAAC+D,IAAI,EACd/D,SAAS,CAACgE,IAAI,CACf;AAAC;AA6IN,SAASC,OAAOA,CAACnD,KAAK,EAAE;EACtB,OAAOf,KAAA,CAAAsD,aAAA,CAAC3C,QAAQ,EAAAwD,QAAA,KAAKpD,KAAK;IAAEgB,QAAQ,EAAE;EAAM,EAAE,CAAC;AACjD;AAEAnB,QAAQ,CAACsD,OAAO,GAAGA,OAAO;AAE1BtD,QAAQ,CAACwD,qBAAqB,GAAG,IAAI"}
+{"version":3,"file":"Skeleton.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","validateDOMAttributes","isTrue","LOCALE","Space","spacingPropTypes","createSpacingClasses","Context","Provider","Skeleton","PureComponent","constructor","props","state","ariaLiveUpdate","componentWillUnmount","clearTimeout","_ariaLiveUpdateTimeout","componentDidUpdate","prevProps","show","setAriaLiveUpdate","getProps","arguments","length","undefined","context","defaultProps","skeleton","no_animation","skeleton_no_animation","getTranslation","setTimeout","aria_busy","aria_ready","newString","setState","render","figure","className","class","_className","children","attributes","_objectWithoutProperties","_excluded","showSkeleton","params","_objectSpread","lang","locale","createElement","_defineProperty","element","process","env","NODE_ENV","propTypes","oneOfType","string","bool","func","node","Exclude","_extends","_supportsSpacingProps"],"sources":["../../../../src/components/skeleton/Skeleton.js"],"sourcesContent":["/**\n * Web Skeleton Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  isTrue,\n} from '../../shared/component-helper'\nimport { LOCALE } from '../../shared/defaults'\nimport Space from '../space/Space'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport Context from '../../shared/Context'\nimport Provider from '../../shared/Provider'\n\nexport default class Skeleton extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    show: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    figure: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    aria_busy: PropTypes.string,\n    aria_ready: PropTypes.string,\n    element: PropTypes.node,\n\n    ...spacingPropTypes,\n\n    class: PropTypes.string,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    show: null,\n    skeleton: null, // only to make sure we process extendPropsWithContextInClassComponent\n    no_animation: null,\n    figure: null,\n    aria_busy: null,\n    aria_ready: null,\n    element: null,\n    class: null,\n    className: null,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n    this.state = { ariaLiveUpdate: null }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._ariaLiveUpdateTimeout)\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.show !== this.props.show) {\n      this.setAriaLiveUpdate()\n    }\n  }\n\n  getProps(props = this.props, context = this.context) {\n    return extendPropsWithContextInClassComponent(\n      props,\n      Skeleton.defaultProps,\n      {\n        skeleton: context.Skeleton || context.skeleton,\n        no_animation: context.skeleton_no_animation,\n      },\n      context.getTranslation(props).Skeleton\n    )\n  }\n\n  setAriaLiveUpdate() {\n    // this is only to make a better screen reader ux\n    clearTimeout(this._ariaLiveUpdateTimeout)\n    this._ariaLiveUpdateTimeout = setTimeout(() => {\n      const { aria_busy, aria_ready } = this.getProps()\n\n      let newString = null\n\n      if (isTrue(this.props.show)) {\n        newString = aria_busy\n      } else {\n        newString = aria_ready\n      }\n\n      if (newString) {\n        this.setState({\n          ariaLiveUpdate: newString,\n        })\n        this._ariaLiveUpdateTimeout = setTimeout(() => {\n          this.setState({\n            ariaLiveUpdate: null,\n          })\n        }, 1e3)\n      }\n    }, 1e3) // so that the input gets read out first, and then the results\n  }\n\n  render() {\n    // consume the skeleton context\n    const props = this.getProps()\n\n    const {\n      show,\n      no_animation,\n      figure,\n      skeleton,\n      aria_busy,\n      aria_ready, // eslint-disable-line\n      className,\n      class: _className,\n      children,\n\n      ...attributes\n    } = props\n\n    const { ariaLiveUpdate } = this.state\n\n    const showSkeleton =\n      typeof show === 'boolean' || typeof show === 'string'\n        ? isTrue(show)\n        : skeleton\n\n    const params = {\n      className: classnames(\n        figure ? 'dnb-skeleton__figure' : 'dnb-skeleton__root',\n        isTrue(showSkeleton) && 'dnb-skeleton',\n        isTrue(no_animation) && 'dnb-skeleton--no-animation',\n        createSpacingClasses(props),\n        className,\n        _className\n      ),\n      // role: 'status',// is not needed as for now\n      'aria-busy': showSkeleton,\n      'aria-label': showSkeleton ? aria_busy : undefined,\n      lang: this.context.locale || LOCALE,\n      ...attributes,\n    }\n\n    validateDOMAttributes(props, params)\n\n    return (\n      <Space {...params}>\n        {figure ? (\n          showSkeleton ? (\n            typeof figure === 'function' ? (\n              figure()\n            ) : (\n              figure\n            )\n          ) : (\n            children\n          )\n        ) : (\n          <Provider\n            skeleton={showSkeleton}\n            skeleton_no_animation={no_animation}\n          >\n            {children}\n          </Provider>\n        )}\n        <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n          {ariaLiveUpdate}\n        </span>\n      </Space>\n    )\n  }\n}\n\nfunction Exclude(props) {\n  return <Provider {...props} skeleton={false} />\n}\n\nSkeleton.Exclude = Exclude\n\nSkeleton._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/skeleton/figures/Article.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Article.js.map

@@ -1 +1 @@
-{"version":3,"file":"Article.js","names":["React","PropTypes","Context","SkeletonArticle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Article.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonArticle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Article.js","names":["React","PropTypes","Context","SkeletonArticle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Article.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonArticle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Circle.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Circle.js","names":["React","PropTypes","Context","SkeletonCircle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Circle.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonCircle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,cAAc,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB9DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,cAAc,iBACZD,OAAO;AAAA6B,eAAA,CADT5B,cAAc,kBAWX;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,cAAc,CAE1BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Circle.js","names":["React","PropTypes","Context","SkeletonCircle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Circle.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonCircle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,cAAc,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB9DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,cAAc,iBACZD,OAAO;AAAA6B,eAAA,CADT5B,cAAc,kBAWX;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,cAAc,CAE1BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Product.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Product.js.map

@@ -1 +1 @@
-{"version":3,"file":"Product.js","names":["React","PropTypes","Context","SkeletonProduct","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Product.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonProduct extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Product.js","names":["React","PropTypes","Context","SkeletonProduct","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Product.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonProduct extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Table.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","names":["React","PropTypes","Context","SkeletonTable","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Table.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonTable extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,aAAa,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB7DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,aAAa,iBACXD,OAAO;AAAA6B,eAAA,CADT5B,aAAa,kBAWV;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,aAAa,CAEzBgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Table.js","names":["React","PropTypes","Context","SkeletonTable","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Table.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonTable extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,aAAa,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB7DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,aAAa,iBACXD,OAAO;AAAA6B,eAAA,CADT5B,aAAa,kBAWV;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,aAAa,CAEzBgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/slider/Slider.d.ts

@@ -6,6 +6,7 @@ import type { SliderAllProps } from './types';
 export * from './types';
 declare function Slider(localProps: SliderAllProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Slider {
+    var _formElement: boolean;
     var _supportsSpacingProps: boolean;
 }
 export default Slider;

package/components/slider/Slider.js

@@ -6,6 +6,7 @@ export * from './types';
 function Slider(localProps) {
   return React.createElement(SliderProvider, localProps, _SliderInstance || (_SliderInstance = React.createElement(SliderInstance, null)));
 }
+Slider._formElement = true;
 Slider._supportsSpacingProps = true;
 export default Slider;
 //# sourceMappingURL=Slider.js.map

package/components/slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","names":["React","SliderProvider","SliderInstance","Slider","localProps","createElement","_SliderInstance","_supportsSpacingProps"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\n\nimport { SliderProvider } from './SliderProvider'\nimport { SliderInstance } from './SliderInstance'\n\nimport type { SliderAllProps } from './types'\n\nexport * from './types'\n\nfunction Slider(localProps: SliderAllProps) {\n  return (\n    <SliderProvider {...localProps}>\n      <SliderInstance />\n    </SliderProvider>\n  )\n}\n\nSlider._supportsSpacingProps = true\n\nexport default Slider\n"],"mappings":";AAKA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,cAAc,QAAQ,kBAAkB;AAIjD,cAAc,SAAS;AAEvB,SAASC,MAAMA,CAACC,UAA0B,EAAE;EAC1C,OACEJ,KAAA,CAAAK,aAAA,CAACJ,cAAc,EAAKG,UAAU,EAAAE,eAAA,KAAAA,eAAA,GAC5BN,KAAA,CAAAK,aAAA,CAACH,cAAc,MAAE,CAAC,CACJ,CAAC;AAErB;AAEAC,MAAM,CAACI,qBAAqB,GAAG,IAAI;AAEnC,eAAeJ,MAAM"}
+{"version":3,"file":"Slider.js","names":["React","SliderProvider","SliderInstance","Slider","localProps","createElement","_SliderInstance","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\n\nimport { SliderProvider } from './SliderProvider'\nimport { SliderInstance } from './SliderInstance'\n\nimport type { SliderAllProps } from './types'\n\nexport * from './types'\n\nfunction Slider(localProps: SliderAllProps) {\n  return (\n    <SliderProvider {...localProps}>\n      <SliderInstance />\n    </SliderProvider>\n  )\n}\n\nSlider._formElement = true\nSlider._supportsSpacingProps = true\n\nexport default Slider\n"],"mappings":";AAKA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,cAAc,QAAQ,kBAAkB;AAIjD,cAAc,SAAS;AAEvB,SAASC,MAAMA,CAACC,UAA0B,EAAE;EAC1C,OACEJ,KAAA,CAAAK,aAAA,CAACJ,cAAc,EAAKG,UAAU,EAAAE,eAAA,KAAAA,eAAA,GAC5BN,KAAA,CAAAK,aAAA,CAACH,cAAc,MAAE,CAAC,CACJ,CAAC;AAErB;AAEAC,MAAM,CAACI,YAAY,GAAG,IAAI;AAC1BJ,MAAM,CAACK,qBAAqB,GAAG,IAAI;AAEnC,eAAeL,MAAM"}

package/components/slider/SliderInstance.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 var _SubtractButton, _AddButton, _AlignmentHelper, _SliderMainTrack, _SliderSuffix;
 import React from 'react';